/* Reputation Engine, the shared stylesheet.
   Served at /static/app.css with a version in the query, and linked after the
   page's own inline styles, so a rule here wins a tie on specificity. Every
   value comes from the --re-* custom properties in tokens.css: no raw colour,
   pixel font size, duration or curve is written in this file. */

/* Inter, the Design's type (RELIVE, 2026-09-26). RE Live asks for Inter at 400,
   500, 600 and 700 and is sent seven subsets, each one variable woff2 file
   declared once per weight; these are those blocks, only the address made
   local: the files are served from this origin, /static/fonts/, so no page
   asks another party for a font. Declared per weight as RE Live's are, a
   weight between two steps renders at the step RE Live renders it at. The
   licence travels with the files (static/fonts/OFL.txt). */
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/inter-cyrillic-ext-ca157063.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:400;font-display:swap;src:url(fonts/inter-cyrillic-71d5ee93.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:400;font-display:swap;src:url(fonts/inter-greek-ext-6e9e020a.woff2) format('woff2');unicode-range:U+1F00-1FFF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/inter-greek-1be3448e.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:400;font-display:swap;src:url(fonts/inter-vietnamese-5c66f9e0.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:400;font-display:swap;src:url(fonts/inter-latin-ext-34b9c504.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/inter-latin-3100e775.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}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/inter-cyrillic-ext-ca157063.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:500;font-display:swap;src:url(fonts/inter-cyrillic-71d5ee93.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:500;font-display:swap;src:url(fonts/inter-greek-ext-6e9e020a.woff2) format('woff2');unicode-range:U+1F00-1FFF}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/inter-greek-1be3448e.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:500;font-display:swap;src:url(fonts/inter-vietnamese-5c66f9e0.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:500;font-display:swap;src:url(fonts/inter-latin-ext-34b9c504.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/inter-latin-3100e775.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}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/inter-cyrillic-ext-ca157063.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:600;font-display:swap;src:url(fonts/inter-cyrillic-71d5ee93.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:600;font-display:swap;src:url(fonts/inter-greek-ext-6e9e020a.woff2) format('woff2');unicode-range:U+1F00-1FFF}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/inter-greek-1be3448e.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:600;font-display:swap;src:url(fonts/inter-vietnamese-5c66f9e0.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:600;font-display:swap;src:url(fonts/inter-latin-ext-34b9c504.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/inter-latin-3100e775.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}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/inter-cyrillic-ext-ca157063.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:700;font-display:swap;src:url(fonts/inter-cyrillic-71d5ee93.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:700;font-display:swap;src:url(fonts/inter-greek-ext-6e9e020a.woff2) format('woff2');unicode-range:U+1F00-1FFF}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/inter-greek-1be3448e.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:700;font-display:swap;src:url(fonts/inter-vietnamese-5c66f9e0.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:700;font-display:swap;src:url(fonts/inter-latin-ext-34b9c504.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-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/inter-latin-3100e775.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}

/* Numerals line up in every column: tabular figures on every number in the
   older views. The older sheets set type with the font shorthand, which
   resets this, so the rule has to win over them. RE Live's views (the rail,
   the top bar, the legend footer, the Overview, the detail column and the
   pane's RE Live tabs) set tabular figures only on the numerals RE Live sets
   them on, so they start from normal (the property inherits, so each
   container says so) and name those numerals below (RELIVE integration: in
   Inter, tabular figures also set the comma, so text with none differed). The
   pane's working views (the Findings route, the topics' planning and the
   Reddit table, data-re-work) keep the older views' rule. */
:not(:is(#rail,.re-topwrap,.re-foot,.re-ov,.re-detail,#pane),:is(#rail,.re-topwrap,.re-foot,.re-ov,.re-detail,#pane) *),
:not(:is(#rail,.re-topwrap,.re-foot,.re-ov,.re-detail,#pane),:is(#rail,.re-topwrap,.re-foot,.re-ov,.re-detail,#pane) *)::before,
:not(:is(#rail,.re-topwrap,.re-foot,.re-ov,.re-detail,#pane),:is(#rail,.re-topwrap,.re-foot,.re-ov,.re-detail,#pane) *)::after,
#pane [data-re-work],#pane [data-re-work] *,#pane [data-re-work] *::before,#pane [data-re-work] *::after{
  font-variant-numeric:tabular-nums!important}
:is(#rail,.re-topwrap,.re-foot,.re-ov,.re-detail,#pane){font-variant-numeric:normal}
/* RE Live's tabular numerals are named in their own views' sections:
   page:home for the Overview's, page:pane-content for the pane's. */

/* Reduced motion: every transition and animation takes no time, and nothing
   scrolls smoothly. */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
  html{scroll-behavior:auto!important}
}

/* page:shell start */
/* RE Live: shell (side nav, grid, background, top bar, text size, theme
   switch). UI port 3b, drawn as RE Live draws it since RELIVE (2026-09-26):
   each rule below is the inline style RE Live's own element carries, on the
   same tokens, so a parity run compares like with like. Where live has a
   piece RE Live does not (the account menu, the pane's close, the phone
   bar, a client link's top bar), it is drawn from the same tokens.

   The signed-in page is a grid on the app root, six tracks: an empty first
   track, a centring gutter, the rail, the main column, the pane and the
   other gutter. The cap covers the main column while the pane is closed and
   the main column plus the pane while it is open; the rail sits outside the
   cap, so the app block is the rail plus 3360px at most. The pane's width,
   PANE below, is
     max(0px, min(100% - rail - main minimum, (100% - rail) x ratio, pane max))
   with 100% the grid's own width. Every width is a token, and a client
   link's grid drops the rail's track. */

/* The background (RELIVE): RE Live's two layers behind the app, fixed to
   the window on every signed-in view and on a client link's page: the dust
   lane (#re-dust, a canvas the page script draws, MOTION.md's Dust lane)
   and the twin glow (#re-glow). RE Live stacks them at z-index 0 under a
   main column raised to 1; here they sit at -1, above the body's own ground
   and under every view, so the main column needs no stacking context of its
   own (one would trap the views' fixed layers, the sprint and the source
   menu, under the rail). Neither takes a pointer, and neither prints. */
#re-dust{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1;pointer-events:none;display:block}
#re-glow{position:fixed;inset:-12%;z-index:-1;pointer-events:none;background:var(--re-twin-glow)}
@media print{#re-dust,#re-glow{display:none}}
/* The page's root carries a ground of its own, so the body's opaque ground
   is painted as a box, over anything at a negative z-index in the root's
   stacking context. The body is therefore its own stacking context
   (isolation, never a position or a transform, so no fixed or absolute
   layer changes its containing block): its ground first, then the two
   layers, then every view. */
body{isolation:isolate}

/* Text size (UI port 3b), the Design's mechanism. A, A+ and A++ set
   data-size s, m or l on the main column and on the pane's inner wrapper,
   never on the rail; tokens.css turns that into --re-base (15, 16 or 18px)
   and every --re-text-* size is a multiple of it, so everything inside
   scales and the rail does not. Both render at --re-ultrawide-scale: 1, or
   1.25 on a window wider than 3000px, whatever the pick. Text that sets no
   size of its own keeps the body's size: in RE Live's views (the Overview,
   the detail column, the pane) that is RE Live's own rule, since RE Live's
   main column and pane set no size themselves and every size RE Live draws
   is a --re-text-* multiple that scales (RELIVE fix round: their elements
   were 16.31px at A++ where RE Live's are 14.5px). Every other page still
   sets it again from the column's base, as 3b built it (the drawn Overview
   is told by its own marker, data-uov: the Clients list borrows its class,
   and its loading and error states have no words that take this size),
   and so do the pane's working views (the Findings route, the topics'
   planning and the Reddit table, data-re-work), from the pane's. */
#view,.re-pane-inner{zoom:var(--re-ultrawide-scale)}
#view:not(:has(>[data-uov])):not(:has(>.re-detail)),#pane [data-re-work]{font-size:var(--re-text-md)}

/* The window's scrollbar keeps its gutter whether or not the page is tall
   enough to need it (UI port QA fix 1). Past the rail plus the cap (3432px)
   the two centring tracks split the width the scrollbar takes, so a page
   that grew a scrollbar as its data arrived moved the rail and the main
   column sideways (4px at 3440, 7px at 5120), and at any width the main
   column narrowed by the scrollbar's width, moving what sits at its right. */
html{scrollbar-gutter:stable}
.re-app{display:grid;min-height:100vh;
  grid-template-columns:0 minmax(0,1fr) var(--re-rail-w)
    minmax(var(--re-roster-w),var(--re-layout-maxw)) 0 minmax(0,1fr)}
/* open: the main column gives the pane its share of the cap (PANE twice) */
.re-pane-open .re-app{
  grid-template-columns:0 minmax(0,1fr) var(--re-rail-w)
    minmax(var(--re-roster-w),calc(var(--re-layout-maxw) - max(0px,min(100% - var(--re-rail-w) - var(--re-roster-w),(100% - var(--re-rail-w)) * var(--re-pane-ratio),var(--re-pane-maxw)))))
    max(0px,min(100% - var(--re-rail-w) - var(--re-roster-w),(100% - var(--re-rail-w)) * var(--re-pane-ratio),var(--re-pane-maxw)))
    minmax(0,1fr)}
body.u-share .re-app{
  grid-template-columns:0 minmax(0,1fr) minmax(var(--re-roster-w),var(--re-layout-maxw)) 0 minmax(0,1fr)}
.re-pane-open body.u-share .re-app{
  grid-template-columns:0 minmax(0,1fr)
    minmax(var(--re-roster-w),calc(var(--re-layout-maxw) - max(0px,min(100% - var(--re-roster-w),100% * var(--re-pane-ratio),var(--re-pane-maxw)))))
    max(0px,min(100% - var(--re-roster-w),100% * var(--re-pane-ratio),var(--re-pane-maxw)))
    minmax(0,1fr)}
.re-app>#rail{grid-column:3;grid-row:1}
.re-app>#view{grid-column:4;grid-row:1}
.re-app>#pane{grid-column:5;grid-row:1}
body.u-share .re-app>#view{grid-column:3}
body.u-share .re-app>#pane{grid-column:4}

/* The main column (RE Live's re-main): a flex column, so a footer slot can
   sit at its foot, transparent over the background, with RE Live's padding
   (24px, 22px at the sides, 32px at the foot) and a 1px rule on its right.
   It clips anything wider than itself instead of letting the page scroll
   sideways; its content reflows to fit. */
.re-app>#view{display:flex;flex-direction:column;min-width:0;max-width:none;width:auto;margin:0;
  padding:var(--re-space-8) 22px calc(var(--re-space-9) + 48px);overflow-x:clip;background:transparent;
  border-right:var(--re-border-width) solid var(--re-color-border)}
/* (the 10-31 promote: 48px more at the foot, so the last legend row and Privacy clear the Notes button; a
   client link has no Notes button and keeps its 32px) */
body.u-share .re-app>#view{border-right:0;padding-bottom:var(--re-space-9)}
@media (min-width:760.02px){.re-app>#view.re-detail-view{padding-bottom:var(--re-space-9)}}
/* the main column in detail mode (RE Live's isDetail re-main, PROMOTE
   2026-09-29): it stays put at the window's height and scrolls on its own
   while the page scrolls the pane, and the switch list fills what the client
   column leaves (page:pane-reddit) */
.re-app>#view.re-detail-view{position:sticky;top:0;align-self:start;height:calc(100vh / var(--re-ultrawide-scale));
  overflow-x:hidden;overflow-y:auto;gap:var(--re-space-6)}

/* The pane (RE Live's re-pane): the fifth track, closed by default, on the
   pane surface. It scrolls with the page, as RE Live's does (RELIVE
   integration: it was sticky with a scroll of its own, whose scrollbar took
   15px from everything in it): as tall as its row, clipped top to bottom,
   scrolling sideways only if its content were wider. Its inner wrapper
   carries the text size and the ultrawide scale, like the main column (see
   the text size rules above), and RE Live's padding (24px, 26px at the
   sides, 34px at the foot). */
.re-app>#pane{position:relative;z-index:1;min-width:0;overflow-x:auto;overflow-y:hidden;
  padding:var(--re-space-8) 26px 34px;background:var(--re-color-surface-pane)}
#pane[hidden]{display:none}
/* RE Live's padding is the pane's own (PROMOTE, 2026-10-21), not its inner wrapper's */
.re-pane-inner{min-width:min(560px,100%)}
/* the shell's own buttons (RE Live's re-btn): the account menu's items. RE
   Live draws no close on the pane: All clients and Esc close it. */
.re-btn{font-family:var(--re-font-ui);cursor:pointer}

/* Long text rows stop near 90 characters, however wide the column. */
.re-app p,.re-pane-body p,.u-item .u-t,.u-note{max-width:90ch}

/* 760px and below: one column. The pane's formula would leave it no width
   there, so an open pane covers the main column instead, above the rail's
   bar along the bottom edge. */
@media (max-width:760px){
  .re-app,.re-pane-open .re-app{grid-template-columns:0 0 0 minmax(0,1fr) 0 0}
  body.u-share .re-app,.re-pane-open body.u-share .re-app{grid-template-columns:0 0 minmax(0,1fr) 0 0}
  .re-app>#view{padding:var(--re-space-6) var(--re-space-6) calc(var(--re-space-9) + 40px + 2 * var(--re-space-3) + env(safe-area-inset-bottom));
    border-right:0}
  body.u-share .re-app>#view{padding-bottom:var(--re-space-9)}
  /* the pane covers the detail column here, so it keeps the page's flow */
  .re-app>#view.re-detail-view{position:static;height:auto;overflow-x:clip;overflow-y:visible}
  /* the pane covers the column here, so it paints the page's canvas: its
     own surface is the Design's half-clear glass, which let the column
     behind show through its words (RELIVE integration) */
  .re-app>#pane{position:fixed;top:0;left:0;right:0;bottom:calc(40px + 2 * var(--re-space-3) + var(--re-border-width) + env(safe-area-inset-bottom));
    z-index:35;height:auto;align-self:stretch;overflow-y:auto;background:var(--re-color-bg)}
  body.u-share .re-app>#pane{bottom:0}
}
/* The rail (RE Live's re-rail): the third track, sticky, the window's
   height, its own scroll; the rail gradient, and the rail shadow, a 1px
   edge where it meets the page and a soft shade over the main column. The
   mount carries data-theme="dark", so it keeps the dark values in both
   themes. Its items are 40px, 10px round, 10px apart; the one in use is
   the active gradient with its glow, the rest the meta grey. */
#rail.re-rail{position:sticky;top:0;align-self:start;z-index:2;height:calc(100vh / var(--re-rail-scale,1));zoom:var(--re-rail-scale,1);
  overflow-x:hidden;overflow-y:auto;
  display:flex;flex-direction:column;align-items:center;gap:10px;padding:var(--re-space-7) 0;
  background:var(--re-rail-bg);box-shadow:var(--re-shadow-rail);
  color:var(--re-color-text);font-family:var(--re-font-ui)}
#rail[hidden]{display:none}
/* the mark: RE Live's button, which sets no font or ink of its own (the
   browser's), the mark itself painted in the accent */
.re-rail-logo{display:grid;place-items:center;flex:none;width:40px;height:40px;padding:0;
  margin:3px 0 var(--re-space-5);border:0;background:none;font:revert;color:revert;cursor:pointer}
/* on the client page RE Live Client's mark is a link (PROMOTE, 2026-10-21),
   so it takes the rail's own type and ink rather than the browser's */
.re-pane-open .re-rail-logo{font:inherit;color:inherit}
.re-mark{display:block;width:22px;height:22px}
.re-mark path{stroke:var(--re-color-accent)}
.re-mark circle{fill:var(--re-color-accent)}
.re-rail-items{display:flex;flex-direction:column;align-items:center;gap:10px}
.re-rail-item{position:relative;display:grid;place-items:center;flex:none;width:40px;height:40px;
  border-radius:var(--re-radius-container);color:var(--re-color-text-meta);text-decoration:none}
.re-rail-item svg.u-i{width:18px;height:18px;stroke-width:1.75}
.re-rail-item:hover{color:var(--re-color-text);background:var(--re-color-surface-hover)}
.re-rail-logo:focus-visible,.re-rail-item:focus-visible,.re-zoom-track:focus-visible,.re-theme-toggle:focus-visible,
.re-avatar:focus-visible,.re-account-item:focus-visible{
  outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:2px}
.re-rail-item[aria-current="page"],.re-rail-item[aria-current="page"]:hover{
  color:var(--re-color-on-accent);background:var(--re-nav-active-bg);box-shadow:var(--re-shadow-glow-active)}
/* the health warning on Settings: a glyph and a count, never a dot. RE Live
   draws no badge; it is drawn as RE Live's own rail pill, the initials (the
   rail avatar's fill and border), its count in the badge's 700 (RELIVE fix
   round: a border and a fill RE Live never paints, and a count at 900) */
.re-rail-badge{position:absolute;top:-4px;right:-6px;display:inline-flex;align-items:center;gap:var(--re-space-1);
  padding:0 var(--re-space-2);border:var(--re-border-width) solid var(--re-color-rail-avatar-border);
  border-radius:var(--re-radius-pill);background:var(--re-color-rail-avatar);color:var(--re-color-text);
  font-size:var(--re-text-xs);font-weight:700;line-height:1.5}
.re-rail-badge b{font-weight:inherit}
.re-rail-badge svg.u-i{width:10px;height:10px;stroke-width:2}
.re-rail-badge[hidden]{display:none}
/* the foot: RE Live's text size group (pushed to the foot), the theme
   switch 8px under it and the initials 10px under that, each also the
   rail's 10px apart */
.re-rail-foot{margin-top:auto;display:flex;flex-direction:column;align-items:center;gap:10px}
.re-account{margin-top:10px}

/* The text size slider and the theme switch: stacked at the foot of the
   rail, in a row in the account menu and in a client link's top bar. The
   slider is RE Live's (PROMOTE, 2026-10-21; it replaced the A, A+ and A++
   group): a 36 by 120 pill on the rail's control fill and edge whose fill
   rises from the foot with the scale (--re-zoom-fill, 0 at 81.25% and 1 at
   200%, a 28px floor), the A at its foot in the rail's mid tone, and the
   percent under it. The rail zooms by the scale, so the A and the percent
   divide it back out of their sizes, as RE Live draws them fixed. */
.re-prefs{display:flex;align-items:center;flex-wrap:wrap;gap:var(--re-space-4)}
.re-rail-foot>.re-prefs{flex-direction:column;flex-wrap:nowrap;gap:10px}
.re-zoom{display:flex;flex-direction:column;align-items:center;gap:6px}
.re-zoom-track{position:relative;display:block;width:36px;height:120px;overflow:hidden;
  border:var(--re-border-width) solid var(--re-color-rail-control-border);border-radius:var(--re-radius-pill);
  background:var(--re-color-rail-control);cursor:ns-resize;touch-action:none;user-select:none}
.re-zoom-track>i{position:absolute;left:0;right:0;bottom:0;height:calc(28px + (100% - 28px) * var(--re-zoom-fill,0));
  background:var(--re-color-text);pointer-events:none}
.re-zoom-track>span{position:absolute;left:0;right:0;bottom:7px;text-align:center;pointer-events:none;
  font:700 calc(var(--re-text-130) / var(--re-scale,1))/1 var(--re-font-ui);color:var(--re-color-rail-mid)}
.re-zoom-pct{font:650 calc(var(--re-text-110) / var(--re-scale,1)) var(--re-font-ui);font-variant-numeric:tabular-nums;
  color:var(--re-color-text-muted)}
/* every glide group's two faces (the pane's tabs, the client column's
   category switcher): the muted face shows, the dark face only on the
   picked item, where the highlight lies */
[data-glide-item]>[data-on]{opacity:0}
[data-glide-item][data-sel="true"]>[data-off]{opacity:0}
[data-glide-item][data-sel="true"]>[data-on]{opacity:1}
/* in a row (the account menu, a client link's top bar) the slider lies on
   its side, 120 by 28, its fill growing from the left and the A at its start */
.re-account-prefs .re-zoom,.re-topbar .re-zoom{flex-direction:row}
.re-account-prefs .re-zoom-track,.re-topbar .re-zoom-track{width:120px;height:28px}
.re-account-prefs .re-zoom-track>i,.re-topbar .re-zoom-track>i{top:0;right:auto;height:auto;
  width:calc(28px + (100% - 28px) * var(--re-zoom-fill,0))}
.re-account-prefs .re-zoom-track>span,.re-topbar .re-zoom-track>span{top:50%;bottom:auto;right:auto;width:28px;transform:translateY(-50%)}
/* the theme switch (RE Live's re-theme-toggle): 40 by 34, 4px round, on the
   rail's control fill and edge in the rail; pressed (the page is light) it
   is the accent. RE Live sets it 8px under the size group. */
.re-theme-toggle{display:inline-grid;place-items:center;width:40px;height:34px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice-sm);
  background:var(--re-color-surface-raised);color:var(--re-color-text-muted);font:revert;cursor:pointer}
#rail .re-theme-toggle{border-color:var(--re-color-rail-control-border);background:var(--re-color-rail-control)}
.re-rail-foot>.re-prefs>.re-theme-toggle{margin-top:var(--re-space-4)}
.re-theme-toggle:hover,#rail .re-theme-toggle:hover{color:var(--re-color-text);border-color:var(--re-color-text-faint)}
.re-theme-toggle[aria-pressed="true"],#rail .re-theme-toggle[aria-pressed="true"]{
  border-color:var(--re-color-accent);background:var(--re-color-accent);color:var(--re-color-on-accent)}
.re-theme-toggle svg.u-i{width:17px;height:17px;stroke-width:1.9}
/* on the client page RE Live Client draws the switch unfilled in both
   themes (PROMOTE, 2026-10-21): its glyph alone says the page is light */
.re-pane-open #rail .re-theme-toggle[aria-pressed="true"]{border-color:var(--re-color-rail-control-border);
  background:var(--re-color-rail-control);color:var(--re-color-text-muted)}
.re-pane-open #rail .re-theme-toggle[aria-pressed="true"]:hover{color:var(--re-color-text);border-color:var(--re-color-text-faint)}

/* The account initials (RE Live's re-avatar): 32px, round, on the rail's
   avatar fill; and their menu. The menu sits in the rail but takes the
   page's theme (its own data-theme, kept in step by uPrefControlsSync), as
   RE Live draws it: the page colour under the glass sheen, so what it floats
   over never shows through its words, 10px round like every container, with
   the card shadow. */
.re-account{position:relative;display:flex}
.re-avatar{display:grid;place-items:center;width:32px;height:32px;padding:0;
  border:var(--re-border-width) solid var(--re-color-rail-avatar-border);border-radius:var(--re-radius-pill);
  background:var(--re-color-rail-avatar);color:var(--re-color-text);font:600 var(--re-text-xs) var(--re-font-ui);cursor:pointer}
.re-avatar:hover,.re-avatar[aria-expanded="true"]{border-color:var(--re-color-border-strong)}
.re-account-menu{position:fixed;z-index:50;display:flex;flex-direction:column;gap:2px;
  width:260px;max-width:calc(100vw - 16px);padding:var(--re-space-3);
  background:var(--re-sheen),var(--re-color-bg);border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-container);box-shadow:var(--re-shadow-card);
  color:var(--re-color-text);font:400 var(--re-text-130)/1.45 var(--re-font-ui);text-align:left}
.re-account-menu[hidden]{display:none}
/* RE Live's account menu (PROMOTE, 2026-10-25): the email and the role over a
   line, then the items, Settings first for an owner, each 36px tall (44 on a
   phone), its warning badge a glyph and a count on the down edge */
.re-account-head{display:flex;flex-direction:column;gap:2px;margin-bottom:4px;padding:8px 10px 10px;
  border-bottom:var(--re-border-width) solid var(--re-color-line)}
.re-account-email{font:700 var(--re-text-135) var(--re-font-ui);overflow-wrap:anywhere}
.re-account-role{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-account-prefs{display:none;padding:4px 10px 8px;margin-bottom:4px;border-bottom:var(--re-border-width) solid var(--re-color-line)}
.re-account-item,.re-account-menu .u-pwlink .u-linkbtn{display:flex;align-items:center;gap:var(--re-space-3);width:100%;min-height:36px;
  padding:0 10px;border:0;border-radius:var(--re-radius-choice-sm);background:none;color:var(--re-color-text);
  font:600 var(--re-text-sm) var(--re-font-ui);text-align:left;text-decoration:none;cursor:pointer}
.re-account-item:hover,.re-account-menu .u-pwlink .u-linkbtn:hover{background:var(--re-color-surface-hover)}
.re-account-menu .u-pwlink{margin:0}
.re-account-menu .re-rail-badge{position:static;margin-left:auto;gap:4px;padding:1px 8px;border-color:var(--re-color-down-border);
  background:none;color:var(--re-color-down);font-variant-numeric:tabular-nums}
.re-account-menu .re-rail-badge svg.u-i{width:12px;height:12px;stroke-width:2.2}

/* 760px and below: the rail is a bar along the bottom edge with the same
   items; the size group and the switch move into the account menu */
@media (max-width:760px){
  #rail.re-rail{position:fixed;top:auto;left:0;right:0;bottom:0;z-index:40;height:auto;zoom:1;
    flex-direction:row;justify-content:space-around;gap:var(--re-space-2);overflow:visible;
    padding:var(--re-space-3) var(--re-space-4) calc(var(--re-space-3) + env(safe-area-inset-bottom));
    box-shadow:none;border-top:var(--re-border-width) solid var(--re-color-rail-edge)}
  .re-rail-logo{margin:0}
  .re-rail-items{flex-direction:row;gap:var(--re-space-2)}
  .re-rail-foot{margin:0;flex-direction:row}
  .re-rail-foot>.re-prefs{display:none}
  .re-account{margin-top:0}
  .re-account-prefs{display:block}
  .re-account-item,.re-account-menu .u-pwlink .u-linkbtn{min-height:44px}
}
/* The top bar (reTopBar), at the top of the main column on every view.
   RE Live's re-topbar is the title row: the h1 (Engine in the accent text)
   and its meta line in the meta colour, baseline aligned, then the view's
   own controls at the end. The strip is its own row 16px under it: on the
   Overview the stale-scan column and the scan chip. re-topwrap holds the
   crumb and the two rows and leaves 24px under them (on the Overview,
   nothing: page:home). A client link's top bar leads with the mark and ends
   with the theme and text size controls. */
.re-topwrap{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:var(--re-space-8)}
/* a crumb above the title keeps its own width, 12px over the title row;
   the title row and the strip take the column's */
.re-topwrap>.re-topbar,.re-topwrap>.re-topbar-strip{align-self:stretch}
.re-topwrap>.re-topbar:not(:first-child){margin-top:var(--re-space-5)}
.re-topbar{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) var(--re-space-6)}
.re-topbar-mark{display:inline-flex;align-self:center;color:var(--re-color-accent)}
.re-topbar-title{margin:0;color:var(--re-color-text);font-size:var(--re-text-xl);font-weight:700;
  letter-spacing:-0.03em;line-height:1.55;overflow-wrap:anywhere}
.re-topbar-accent{color:var(--re-color-accent-text)}
/* the Overview's identity line under the title (the 10-31 promote) and AI answer tracking said as not on yet */
.re-topbar-id{display:flex;flex-direction:column;gap:var(--re-space-2);flex:1 1 340px;min-width:0;max-width:880px}
.re-topbar-id .re-topbar-title{white-space:nowrap}
.re-topbar-lede{color:var(--re-color-text-2);font-size:var(--re-text-150);line-height:1.45;text-wrap:pretty}
.re-topbar-ai{display:inline-flex;align-items:center;gap:var(--re-space-3);color:var(--re-color-text-meta);font-size:var(--re-text-120)}
.re-topbar-ai svg.u-i{display:block;flex:none;width:13px;height:13px;stroke-width:2.2}
.re-topbar-meta{max-width:90ch;color:var(--re-color-text-meta);font-size:var(--re-text-130)}
.re-topbar-actions{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-4);margin-left:auto;align-self:center}
.re-topbar-strip{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px 14px;margin-top:var(--re-space-6)}
/* the Overview's stale-scan warning (RE Live's re-alert): a column with the
   strip, in the down red with its glyph, on the down tint behind the bar
   glass, 10px round; and Check the sources on its own line under it, in the
   accent, indented to the strip's words */
.re-alert-col{display:flex;flex-direction:column;gap:7px;flex:1 1 440px;min-width:0}
.re-alert{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-3) var(--re-space-5);padding:9px 14px;
  border:var(--re-border-width) solid var(--re-color-down-border);border-radius:var(--re-radius-container);
  background:var(--re-color-down-tint);backdrop-filter:var(--re-glass-blur-bar);-webkit-backdrop-filter:var(--re-glass-blur-bar)}
.re-alert svg.u-i{width:16px;height:16px;flex:none;stroke-width:2;stroke:var(--re-color-down)}
.re-alert-n{font:700 var(--re-text-130) var(--re-font-ui);color:var(--re-color-down)}
.re-alert-text{font-size:var(--re-text-130);font-weight:650}
.re-alert-names{font-size:var(--re-text-sm);color:var(--re-color-text-muted)}
/* the older sheet gives every link in a view its parent's colour (.u-view a,
   a class and an element), which outranked one class: Check the sources
   painted in the text colour (UI port QA fix 2). Two classes and the element
   win the accent back. */
.re-alert-col>a.re-alert-link{align-self:flex-start;padding-left:14px;color:var(--re-color-accent);
  font-size:var(--re-text-sm);font-weight:650;text-decoration:none}
.re-alert-col>a.re-alert-link:hover{color:var(--re-color-accent-text)}
/* the scan chip (RE Live's re-pill): a pill on the glass surface behind the
   bar glass, ending the strip row; its glyph a warning in the down red while
   a scan is stale, a check in the up green when none is */
.re-pill{display:inline-flex;align-items:center;gap:var(--re-space-4);padding:var(--re-space-4) 14px;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-pill);
  background:var(--re-color-surface);backdrop-filter:var(--re-glass-blur-bar);-webkit-backdrop-filter:var(--re-glass-blur-bar);
  color:var(--re-color-text-2);font-size:var(--re-text-sm);white-space:nowrap}
.re-pill svg.u-i{width:13px;height:13px;flex:none;stroke-width:2}
/* RE Live's connector dialog (PROMOTE, 2026-10-21): an in-page dialog over
   the rail's shade, never a native one, 560px at most, opaque on the page
   canvas under the sheen (RE Live lays the raised fill over the canvas with
   a hand-written gradient, which this sheet keeps to tokens); the server URL and
   the command line in mono blocks, each with an outlined Copy, and the
   app's four steps numbered in the accent. The connector mark is RE Live's
   eight bars, in the accent here (its own ink has no token). This sheet is
   served to a client link, so it names no vendor */
.re-mcp-wrap{position:fixed;z-index:45;inset:0;display:grid;place-items:center;padding:24px;background:var(--re-color-rail-shadow)}
.re-mcp{display:flex;flex-direction:column;gap:var(--re-space-6);width:min(100%,560px);max-height:calc(100vh - 48px);overflow:auto;
  padding:var(--re-space-7);border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-bg);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);color:var(--re-color-text);
  box-shadow:var(--re-shadow-card);font:400 var(--re-text-130)/1.5 var(--re-font-ui)}
.re-mcp-head{display:flex;align-items:flex-start;gap:var(--re-space-4)}
.re-mcp-ic{display:grid;place-items:center;width:40px;height:40px;flex:none;border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-choice)}
.re-mcp-ic svg{width:22px;height:22px;flex:none}
.re-mcp-t{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.re-mcp-t h2{margin:0;font:700 var(--re-text-180)/1.25 var(--re-font-ui);letter-spacing:-0.01em}
.re-mcp-t span{color:var(--re-color-text-2);text-wrap:pretty}
.re-mcp-x{display:grid;place-items:center;width:34px;height:34px;flex:none;padding:0;border:0;background:none;
  color:var(--re-color-text-muted);cursor:pointer}
.re-mcp-x svg.u-i{width:14px;height:14px;stroke-width:2}
.re-mcp-sec{display:flex;flex-direction:column;gap:var(--re-space-3)}
.re-mcp-label{font:650 var(--re-text-95) var(--re-font-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--re-color-text-muted)}
.re-mcp-copy{display:flex;flex-wrap:wrap;gap:var(--re-space-3)}
.re-mcp-copy code{flex:1 1 260px;min-width:0;display:flex;align-items:center;min-height:40px;padding:6px 12px;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-choice);background:var(--re-color-surface);
  font:500 var(--re-text-sm) ui-monospace,Menlo,monospace;overflow-wrap:anywhere;color:var(--re-color-text)}
.re-mcp-copy code[data-mcp="url"]{padding:0 12px}
.re-mcp-copy code[data-off]{color:var(--re-color-text-muted)}
.re-mcp-btn{min-height:40px;padding:0 16px;border:var(--re-border-width) solid var(--re-color-accent);border-radius:var(--re-radius-choice);
  background:transparent;color:var(--re-color-accent-text);font:700 var(--re-text-130) var(--re-font-ui);cursor:pointer}
.re-mcp-btn:hover:not(:disabled){background:var(--re-color-accent);color:var(--re-color-on-accent)}
.re-mcp-btn:disabled{opacity:.5;cursor:not-allowed}
.re-mcp-steps{display:flex;flex-direction:column;gap:var(--re-space-3);margin:0;padding:0;list-style:none}
.re-mcp-steps li{display:grid;grid-template-columns:var(--re-space-8) minmax(0,1fr);gap:var(--re-space-4);align-items:baseline}
.re-mcp-steps b{font:700 var(--re-text-sm) var(--re-font-ui);color:var(--re-color-accent-text)}
.re-mcp-off{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-3);color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-mcp-off[hidden]{display:none}
.re-mcp-foot{color:var(--re-color-text-muted);font-size:var(--re-text-sm);text-wrap:pretty}
.re-mcp-x:focus-visible,.re-mcp-btn:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-mcp-mark g{fill:currentColor}
/* RE Live's quick hits (PROMOTE, 2026-10-21), ending the title row where the
   scan chip was: Health check, Content and Outreach as glass pills with
   their counts (pressed, the accent), then the connector button with MCP
   in muted caps. A pressed pill opens its panel, a full row at the title row's
   foot: the title, what it lists, a way to the view, Close, then one tile
   per client, its mark, its name and note, its number and unit */
.re-topbar .re-qh{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-2)}
.re-topbar .re-qh-btn,.re-topbar .re-qh-mcp{display:inline-flex;align-items:center;gap:var(--re-space-3);min-height:34px;margin:0;padding:0 14px;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-pill);background:var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur-bar);-webkit-backdrop-filter:var(--re-glass-blur-bar);color:var(--re-color-text);
  font:650 var(--re-text-sm) var(--re-font-ui);white-space:nowrap;cursor:pointer}
.re-topbar .re-qh-mcp{border-color:var(--re-color-border-control)}
.re-topbar .re-qh-btn:hover,.re-topbar .re-qh-mcp:hover{border-color:var(--re-color-accent)}
.re-topbar .re-qh-btn[aria-expanded="true"]{border-color:var(--re-color-accent);background:var(--re-color-accent);color:var(--re-color-on-accent)}
.re-topbar .re-qh-btn svg.u-i{display:block;width:14px;height:14px;stroke-width:1.75}
.re-topbar .re-qh-n{color:var(--re-color-text-2);font-weight:700}
.re-topbar .re-qh-btn[aria-expanded="true"] .re-qh-n{color:var(--re-color-on-accent)}
.re-topbar .re-qh-mcp svg{width:16px;height:16px;flex:none}
/* under 600 wide (the 10-31 promote): Needs you leads the row and jumps to the Inbox; the row keeps one line
   and scrolls sideways, every pill 44px tall */
.re-topbar .re-qh-need{display:none}
@media (max-width:599.98px){
  .re-topbar .re-qh-need{display:inline-flex;align-items:center;gap:var(--re-space-3);flex:none;min-height:44px;margin:0;padding:0 14px;
    border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-pill);background:var(--re-color-surface);
    backdrop-filter:var(--re-glass-blur-bar);-webkit-backdrop-filter:var(--re-glass-blur-bar);color:var(--re-color-text);
    font:650 var(--re-text-sm) var(--re-font-ui);white-space:nowrap;cursor:pointer}
  .re-topbar .re-qh-need:hover{border-color:var(--re-color-accent)}
  .re-topbar .re-qh-need:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
  .re-topbar .re-qh-need .re-qh-n{font-variant-numeric:tabular-nums}
  .re-topbar .re-qh-need .re-qh-n[data-ink="meta"]{color:var(--re-color-text-meta)}
  .re-topbar .re-qh-need .re-qh-n[data-ink="text"]{color:var(--re-color-text)}
}
.re-topbar .re-qh-tag{color:var(--re-color-text-muted);font:700 var(--re-text-95) var(--re-font-ui);letter-spacing:.08em}
.re-topbar .re-qh-btn:focus-visible,.re-topbar .re-qh-mcp:focus-visible,.re-qh-close:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);
  outline-offset:var(--re-space-1)}
.re-topbar .re-qh-panel{flex:1 1 100%;display:flex;flex-direction:column;gap:var(--re-space-4);padding:var(--re-space-6);
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card)}
.re-qh-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-2) var(--re-space-5)}
.re-qh-head h2{margin:0;font:700 var(--re-text-150) var(--re-font-ui)}
.re-qh-sub{flex:1;min-width:0;color:var(--re-color-text-meta);font-size:var(--re-text-130)}
.re-topbar a.re-qh-link{color:var(--re-color-accent-text);font:700 var(--re-text-130) var(--re-font-ui);text-decoration:none}
.re-qh-close{display:grid;place-items:center;width:30px;height:30px;padding:0;border:0;background:none;color:var(--re-color-text-muted);cursor:pointer}
.re-qh-close svg.u-i{width:14px;height:14px;stroke-width:2}
/* RE Live's 300px tile minimum, built from tokens: the roster minimum less the widest gutter */
.re-qh-rows{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,calc(var(--re-roster-w) - var(--re-space-10))),1fr));gap:var(--re-space-3)}
.re-topbar a.re-qh-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:var(--re-space-4);padding:10px 12px;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-choice);background:var(--re-color-surface-raised);
  color:var(--re-color-text);text-decoration:none}
.re-topbar a.re-qh-row:hover{border-color:var(--re-color-accent)}
.re-qh-mk{display:block;width:11px;height:11px;flex:none}
.re-qh-mk rect{fill:currentColor}
.re-qh-mk path,.re-qh-mk circle{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;stroke-linecap:round}
.re-qh-mk[data-ink="down"],.re-qh-fig b[data-ink="down"]{color:var(--re-color-down)}
.re-qh-mk[data-ink="accent"],.re-qh-fig b[data-ink="accent"]{color:var(--re-color-accent-text)}
.re-qh-mk[data-ink="meta"],.re-qh-fig b[data-ink="meta"]{color:var(--re-color-text-meta)}
.re-qh-mk[data-ink="muted"]{color:var(--re-color-text-muted)}
.re-qh-fig b[data-ink="text"]{color:var(--re-color-text)}
.re-qh-who{display:flex;flex-direction:column;min-width:0}
.re-qh-who b{overflow:hidden;font:650 var(--re-text-130) var(--re-font-ui);text-overflow:ellipsis;white-space:nowrap}
.re-qh-who span{overflow:hidden;color:var(--re-color-text-muted);font-size:var(--re-text-sm);text-overflow:ellipsis;white-space:nowrap}
.re-qh-fig{display:flex;flex-direction:column;align-items:flex-end}
.re-qh-fig b{font:700 var(--re-text-150) var(--re-font-ui)}
.re-qh-fig span{color:var(--re-color-text-muted);font-size:var(--re-text-95)}
.re-qh-none{color:var(--re-color-text-muted);font-size:var(--re-text-130);text-wrap:pretty}

/* The legend footer (reFooter), as RE Live draws it: a shared slot at the
   foot of the main column, pushed down by its flex column and bleeding to
   its edges (RE Live's 22px sides and 32px foot), on the footer surface
   under a 1px rule; inside it the re-legend row, muted, starting with its
   label. */
.re-foot{display:flex;flex-direction:column;gap:9px;margin:auto -22px calc(var(--re-space-9) * -1);
  padding:14px 22px var(--re-space-6);border-top:var(--re-border-width) solid var(--re-color-line);
  background:var(--re-color-surface-footer)}
.re-legend{display:flex;flex-wrap:wrap;align-items:center;gap:7px 18px;
  color:var(--re-color-text-muted);font-size:var(--re-text-120)}
.re-legend-label{color:var(--re-color-text-meta);font:700 var(--re-text-100) var(--re-font-ui);
  letter-spacing:.12em;text-transform:uppercase}
@media (max-width:760px){
  .re-foot{margin:auto calc(var(--re-space-6) * -1) 0;padding:var(--re-space-5) var(--re-space-6)}
}
/* RE Live v2's toast (shell): centred at the page's foot, raised, the check
   and its words, Undo on the accent's edge when there is one, then Close */
#toasts .re-toast{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;max-width:min(100%,640px);
  padding:8px 8px 8px 16px;border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-container);background:var(--re-color-surface-raised);color:var(--re-color-text);
  box-shadow:var(--re-shadow-card);font:600 var(--re-text-135)/1.4 var(--re-font-ui)}
.re-toast-text{display:inline-flex;align-items:center;gap:8px;min-width:0;color:var(--re-color-text-2)}
.re-toast-text>span{color:var(--re-color-text)}
.re-toast-text svg.u-i{width:15px;height:15px;flex:none;stroke-width:2}
.re-toast-undo{min-height:34px;padding:0 14px;border:var(--re-border-width) solid var(--re-color-accent);
  border-radius:var(--re-radius-choice);background:transparent;color:var(--re-color-accent-text);
  font:700 var(--re-text-130) var(--re-font-ui);cursor:pointer}
.re-toast-undo:hover{background:var(--re-color-accent);color:var(--re-color-on-accent)}
.re-toast-close{display:grid;place-items:center;width:34px;height:34px;border:0;background:none;
  color:var(--re-color-text-muted);cursor:pointer}
.re-toast-close svg.u-i{width:14px;height:14px;stroke-width:2}
/* RE Live v2's Reports (shell): the account picker and its note, then the
   report as the client reads it, light, 820px at most, on the page colour */
.re-rep-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin-top:22px}
.re-rep-pick{display:flex;align-items:center;gap:8px;margin:0}
.re-rep-pick>span{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-rep-pick .re-input{min-width:220px;min-height:32px;padding:5px 9px;border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-choice-sm);background:var(--re-color-surface-raised);color:var(--re-color-text);
  font:600 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-rep-note{color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
.re-rep{display:flex;flex-direction:column;gap:26px;width:100%;max-width:820px;margin-top:14px;padding:36px 40px 40px;
  border-radius:var(--re-radius-container);background:var(--re-color-bg);color:var(--re-color-text);box-shadow:var(--re-shadow-card)}
.re-rep>header{display:flex;flex-direction:column;gap:6px}
.re-rep-kicker{color:var(--re-color-text-meta);font:600 var(--re-text-xs) var(--re-font-ui);letter-spacing:.12em;text-transform:uppercase}
.re-rep h2{margin:0;font-size:var(--re-text-300);font-weight:700;letter-spacing:-0.02em;line-height:1.1;text-wrap:pretty}
.re-rep-asof{color:var(--re-color-text-muted);font-size:var(--re-text-120)}
.re-rep>section{display:flex;flex-direction:column;gap:8px}
.re-rep>section.re-rep-results{padding:18px 20px;border-radius:var(--re-radius-container);background:var(--re-color-surface)}
.re-rep-line{margin:0;font-size:var(--re-text-190);line-height:1.4;font-weight:600;text-wrap:pretty}
.re-rep-sub{margin:0;color:var(--re-color-text-2);font-size:var(--re-text-130);line-height:1.5;text-wrap:pretty}
.re-rep h3{margin:0;font-size:var(--re-text-lg);font-weight:650}
.re-rep>section:not(.re-rep-results) p{margin:0;color:var(--re-color-text-2);font-size:var(--re-text-140);line-height:1.5;text-wrap:pretty}
.re-rep>footer{padding-top:14px;border-top:var(--re-border-width) solid var(--re-color-border);color:var(--re-color-text-muted);
  font-size:var(--re-text-120);line-height:1.5;text-wrap:pretty}
/* RE Live's Notes (shell): fixed at the foot of every signed-in view, the
   pill and its panel above it on the sheen over the page colour, as the
   connect dialog (.re-mcp) draws Design's raised glass; each kind a shape and its
   word, the picked one filled in the accent; a note's own delete x; lifted
   above the rail's bar on a phone */
.re-notes{position:fixed;z-index:42;right:20px;bottom:20px;display:flex;flex-direction:column;align-items:flex-end;gap:var(--re-space-4);
  max-width:calc(100vw - 40px)}
.re-notes-panel,.re-notes-btn{border:var(--re-border-width) solid var(--re-color-border-control);background:var(--re-sheen),var(--re-color-bg);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);color:var(--re-color-text);box-shadow:var(--re-shadow-card)}
.re-notes-panel{display:flex;flex-direction:column;gap:var(--re-space-5);width:380px;max-width:100%;max-height:calc(100vh - 110px);overflow:auto;
  padding:18px;border-radius:var(--re-radius-container);font:400 var(--re-text-130)/1.45 var(--re-font-ui)}
.re-notes-head{display:flex;align-items:center;gap:var(--re-space-3)}
.re-notes-head h2{flex:1;margin:0;font:700 var(--re-text-150) var(--re-font-ui)}
.re-notes-x{display:grid;place-items:center;width:34px;height:34px;margin:0;padding:0;border:0;background:none;color:var(--re-color-text-muted);cursor:pointer}
.re-notes-x svg.u-i,.re-notes-del svg.u-i{width:14px;height:14px;stroke-width:2}
.re-notes-kinds{display:flex;flex-wrap:wrap;gap:var(--re-space-2)}
.re-notes-kind{display:inline-flex;align-items:center;gap:6px;min-height:34px;margin:0;padding:0 12px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice);background:transparent;
  color:var(--re-color-text-2);font:650 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-notes-kind[aria-pressed="true"]{border-color:var(--re-color-accent);background:var(--re-color-accent);color:var(--re-color-on-accent)}
.re-notes-mk{width:10px;height:10px;flex:none}
.re-notes-field{display:flex;flex-direction:column;gap:6px;margin:0}
.re-notes-field>span,.re-notes-lhead>span{color:var(--re-color-text-muted);font:650 var(--re-text-95) var(--re-font-ui);letter-spacing:.08em;
  text-transform:uppercase}
.re-notes-field textarea{min-height:92px;margin:0;padding:10px 12px;border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-choice-sm);background:var(--re-color-surface);color:var(--re-color-text);font:500 var(--re-text-130)/1.45 var(--re-font-ui);
  resize:vertical}
.re-notes-row,.re-notes-lhead{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-3)}
.re-notes-who{flex:1;min-width:0;color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
.re-notes-save{min-height:36px;margin:0;padding:0 16px;border:0;border-radius:var(--re-radius-choice);background:var(--re-color-accent);
  color:var(--re-color-on-accent);font:700 var(--re-text-130) var(--re-font-ui);cursor:pointer}
.re-notes-save:disabled{opacity:.5;cursor:not-allowed}
.re-notes-list{display:flex;flex-direction:column;gap:var(--re-space-3);padding-top:var(--re-space-4);
  border-top:var(--re-border-width) solid var(--re-color-line)}
.re-notes-lhead>span{flex:1}
.re-notes-copy{min-height:30px;margin:0;padding:0 12px;border:var(--re-border-width) solid var(--re-color-accent);border-radius:var(--re-radius-choice);
  background:transparent;color:var(--re-color-accent-text);font:700 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-notes-copy:hover{background:var(--re-color-accent);color:var(--re-color-on-accent)}
.re-notes-note{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px var(--re-space-3);padding:10px 12px;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-choice);background:var(--re-color-surface)}
.re-notes-nk{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font:650 var(--re-text-sm) var(--re-font-ui)}
.re-notes-nk>span{color:var(--re-color-text-muted);font-weight:500}
.re-notes-del{grid-row:span 2;align-self:start;display:grid;place-items:center;width:28px;height:28px;margin:0;padding:0;border:0;
  background:none;color:var(--re-color-text-muted);cursor:pointer}
.re-notes-text{grid-column:1;font-size:var(--re-text-130);white-space:pre-wrap;overflow-wrap:anywhere;text-wrap:pretty}
.re-notes-foot{color:var(--re-color-text-muted);font-size:var(--re-text-120);text-wrap:pretty}
.re-notes-btn{display:inline-flex;align-items:center;gap:var(--re-space-3);min-height:40px;margin:0;padding:0 16px;border-radius:var(--re-radius-pill);
  font:650 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-notes-btn:hover{border-color:var(--re-color-accent)}
.re-notes-btn>svg{width:15px;height:15px;flex:none}
.re-notes-n{min-width:20px;padding:0 6px;border-radius:var(--re-radius-pill);background:var(--re-color-accent);color:var(--re-color-on-accent);
  font:700 var(--re-text-95) var(--re-font-ui);line-height:20px;text-align:center}
.re-notes button:focus-visible,.re-notes textarea:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
@media (max-width:760px){
  .re-notes{right:var(--re-space-5);bottom:calc(40px + 2 * var(--re-space-3) + var(--re-border-width) + env(safe-area-inset-bottom) + var(--re-space-5));
    max-width:calc(100vw - 2 * var(--re-space-5))}
}
/* the Design's status glyphs (the 10-31 promote): a circle, a triangle, a square or a dash, each beside its word;
   the shape takes its ink (data-gl), the svg none of its own, as the Design's glyph draws it */
.re-gl{display:block;flex:none;width:8px;height:8px}
.re-gl>*{fill:var(--re-color-text-muted)}
.re-gl[data-gl="up"]>*{fill:var(--re-color-up)}
.re-gl[data-gl="down"]>*{fill:var(--re-color-down)}
.re-gl[data-gl="accent"]>*{fill:var(--re-color-accent)}
.re-gl[data-gl="atext"]>*{fill:var(--re-color-accent-text)}
.re-gl[data-gl="meta"]>*{fill:var(--re-color-text-meta)}
.re-gl[data-gl="text"]>*{fill:var(--re-color-text)}
.re-gl[data-gl="onaccent"]>*{fill:var(--re-color-on-accent)}
.re-gl[data-gl="content"]>*{fill:var(--re-color-channel-content)}
.re-gl[data-gl="faint"]>*{fill:var(--re-color-text-faint)}
.re-gl>.re-gl-dash{fill:none;stroke:var(--re-color-text-muted);stroke-width:2.6;stroke-linecap:round}
.re-gl[data-gl="meta"]>.re-gl-dash{stroke:var(--re-color-text-meta)}
.re-gl[data-gl="faint"]>.re-gl-dash{stroke:var(--re-color-text-faint)}
/* page:shell end */

/* page:home start */
/* RE Live: Home (RELIVE, the HOME slice, 2026-09-26): the Overview's main
   column with the pane closed, exactly as RE Live draws it. The title row
   and the strip, then the headline boxes (Off target, Close, On target,
   Waiting on us), the filter bar, the roster, Not in rotation and the
   legend's items. Glass surfaces (the sheen over the surface, the glass
   blur, the card shadow), 10px containers, 4 to 6px controls. RE Live's
   colours by name: re-ink-* for text, re-bg-* for fills, re-cb-* for the
   three channels, each always beside a word or a count, so colour is never
   read alone. Every rule for home is scoped to the Overview (.re-ov,
   #re-ov-kpis): .re-kpi-num, .re-drawer-*, .re-status, .re-delta,
   .re-zero and the list rows are shared with the pane and #/clients, and
   their base rules below keep their properties. */

/* the Overview's own column: a flex column that fills the main column, so
   the legend footer can sit at its foot (#/clients shares it) */
.re-ov{display:flex;flex-direction:column;flex:1 1 auto;min-width:0}
/* its top wrap leaves no margin: every block under it carries its own top
   margin as RE Live's do (the headline boxes 14px, the filter bar 22px),
   and in this flex column two margins would add up, not collapse (RELIVE
   fix round: the boxes sat 28px under the strip). Keyed on the Overview's
   own marker (data-uov): #/clients borrows .re-ov and keeps its 24px. The
   empty state (no client yet) keeps the 24px. */
.re-ov[data-uov]>.re-topwrap{margin-bottom:0}
/* RE Live v2: the title never wraps */
.re-ov .re-topbar-title{white-space:nowrap}
.re-ov[data-uov]>.re-topwrap+.u-empty{margin-top:var(--re-space-8)}

/* RE Live's colours by name, inside the Overview */
.re-ov .re-ink-up{color:var(--re-color-up)}
.re-ov .re-ink-down{color:var(--re-color-down)}
.re-ov .re-ink-accent{color:var(--re-color-accent-text)}
.re-ov .re-ink-text{color:var(--re-color-text)}
.re-ov .re-ink-meta{color:var(--re-color-text-meta)}
.re-ov .re-bg-up{background:var(--re-color-up)}
.re-ov .re-bg-down{background:var(--re-color-down)}
.re-ov .re-bg-accent{background:var(--re-color-accent-text)}
.re-ov .re-cb-reddit{background:var(--re-color-channel-reddit)}
.re-ov .re-cb-content{background:var(--re-color-channel-content)}
.re-ov .re-cb-outreach{background:var(--re-color-channel-outreach)}
/* RE Live v2: the Published channel, the Health swatch (muted in the
   legend; on a card its state's: down while open, muted when clear, the
   accent when not covered, the line while queued), and the inks and fills
   its words use */
.re-ov .re-cb-published{background:var(--re-color-channel-published)}
.re-ov .re-cb-health,.re-ov .re-cb-muted{background:var(--re-color-text-muted)}
.re-ov .re-cb-down{background:var(--re-color-down)}
.re-ov .re-cb-accent{background:var(--re-color-accent-text)}
.re-ov .re-cb-line{background:var(--re-color-line)}
.re-ov .re-bg-meta,.re-ov .re-bg-muted{background:var(--re-color-text-muted)}
.re-ov .re-ink-muted{color:var(--re-color-text-muted)}
.re-ov .re-ink-text2{color:var(--re-color-text-2)}

/* a headline numeral, the shared base: the pane's summary, stat, ledger and
   proof figures size it again in their own sections */
.re-kpi-num{font-size:var(--re-text-2xl);font-weight:700;line-height:.86;
  letter-spacing:-0.04em;font-variant-numeric:tabular-nums;color:var(--re-color-text)}

/* the KPI ladder (the 10-31 promote) in the headline boxes' place, outcome first, on a 208px minimum track: five
   rungs, each a button that keeps the clients that drive it (pressed: the hover surface, the strong edge and
   Showing N with a check), the input rung drawn quiet (no fill, a dashed edge, no shadow); under 980 wide the
   rungs keep one row that scrolls sideways */
.re-ov-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,208px),1fr));
  gap:var(--re-space-5);margin-top:14px}
#re-ov-kpis .re-kpi{display:flex;flex-direction:column;gap:var(--re-space-3);min-width:0;margin:0;padding:var(--re-space-6);
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card);
  color:inherit;font:inherit;text-align:left;cursor:pointer}
#re-ov-kpis .re-kpi:hover{border-color:var(--re-color-border-strong)}
#re-ov-kpis .re-kpi[data-quiet]{border-style:dashed;border-color:var(--re-color-border-control);background:transparent;box-shadow:none}
#re-ov-kpis .re-kpi[aria-pressed="true"]{border-style:solid;border-color:var(--re-color-border-strong);background:var(--re-color-surface-hover)}
#re-ov-kpis .re-kpi:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
#re-ov-kpis .re-kpi-top{display:flex;align-items:center;gap:var(--re-space-3);color:var(--re-color-text-meta);
  font:600 var(--re-text-100) var(--re-font-ui);letter-spacing:.12em;text-transform:uppercase}
#re-ov-kpis .re-kpi-step{font-variant-numeric:tabular-nums}
#re-ov-kpis .re-kpi-state{display:inline-flex;align-items:center;gap:4px;margin-left:auto;color:var(--re-color-text-2);letter-spacing:.04em}
#re-ov-kpis .re-kpi-state svg.u-i{display:block;flex:none;width:12px;height:12px;stroke-width:2.2}
#re-ov-kpis .re-kpi-label{font-size:var(--re-text-170);font-weight:700;letter-spacing:-0.015em;line-height:1.1}
#re-ov-kpis .re-kpi-val{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-2) var(--re-space-4)}
#re-ov-kpis .re-kpi-num{font-size:var(--re-text-2xl);font-weight:700;line-height:.9;letter-spacing:-0.04em}
#re-ov-kpis .re-kpi-num[data-fs="200"]{font-size:var(--re-text-200)}
#re-ov-kpis .re-kpi-num[data-fs="240"]{font-size:var(--re-text-240)}
#re-ov-kpis .re-kpi-num[data-fs="300"]{font-size:var(--re-text-300)}
#re-ov-kpis .re-kpi-unit{color:var(--re-color-text-2);font-size:var(--re-text-130);font-weight:600;line-height:1.3;text-wrap:pretty}
#re-ov-kpis .re-kpi-move{display:inline-flex;align-items:center;gap:5px;font-size:var(--re-text-130);font-weight:650}
#re-ov-kpis .re-kpi-move svg.u-i{display:block;flex:none;width:14px;height:14px;stroke-width:2.2}
#re-ov-kpis .re-kpi-detail{color:var(--re-color-text-meta);font-size:var(--re-text-xs);line-height:1.45;text-wrap:pretty}
@media (max-width:979.98px){
  .re-ov-kpis{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:minmax(232px,76%);overflow-x:auto;padding-bottom:var(--re-space-2)}
}

/* the filter bar: RE Live's glass bar, the line, the to-review badge (square,
   the accent's border and tint), then Filter, the segment menu and two
   selects; above the roster, so the menu opens over it (the 11-02 promote) */
.re-ov .re-filterbar{position:relative;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:22px 0 14px;padding:11px 14px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card)}
.re-fb-line{color:var(--re-color-text-2);font-size:var(--re-text-sm);font-weight:600;white-space:nowrap}
.re-fb-badge{display:inline-flex;align-items:baseline;gap:7px;padding:var(--re-space-2) 10px;
  border:var(--re-border-width) solid var(--re-color-border-accent);background:var(--re-color-accent-tint);white-space:nowrap}
.re-fb-badge b{color:var(--re-color-accent-text);font:700 var(--re-text-150) var(--re-font-ui)}
.re-fb-badge span{color:var(--re-color-text-2);font-size:var(--re-text-120)}
/* RE Live's need-a-person count (PROMOTE, 2026-10-21): a dashed square beside
   the badge, its number and words muted */
.re-fb-need{display:inline-flex;align-items:baseline;gap:7px;padding:var(--re-space-2) 10px;
  border:var(--re-border-width) dashed var(--re-color-border-control);white-space:nowrap}
.re-fb-need b{color:var(--re-color-text-muted);font:700 var(--re-text-150) var(--re-font-ui);font-variant-numeric:tabular-nums}
.re-fb-need span{color:var(--re-color-text-muted);font-size:var(--re-text-120)}
.re-fb-controls{display:flex;flex:1 1 auto;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--re-space-4);margin-left:auto}
.re-fb-label{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
/* RE Live v2's Mine: a raised toggle, on the accent while it is on; the
   strategist select it stands in for faded and disabled beside it */
.re-ov .re-fb-mine{display:inline-flex;align-items:center;gap:7px;min-height:32px;margin:0;padding:5px 11px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice-sm);
  background:var(--re-color-surface-raised);color:var(--re-color-text-muted);font:650 var(--re-text-sm) var(--re-font-ui);
  cursor:pointer;white-space:nowrap}
.re-ov .re-fb-mine[aria-pressed="true"]{border-color:var(--re-color-accent);background:var(--re-color-accent);color:var(--re-color-on-accent)}
.re-ov .re-fb-mine svg.u-i{width:13px;height:13px;flex:none;stroke-width:2}
.re-ov .re-fb-mine:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-ov .re-filterbar .re-input[data-ref="strat"]:disabled{opacity:.55}
.re-fb-sel{display:flex;margin:0}
.re-ov .re-filterbar .re-input{min-width:150px;min-height:32px;margin:0;padding:5px 9px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice-sm);
  background:var(--re-color-surface-raised);color:var(--re-color-text);font:600 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-ov .re-filterbar .re-input[data-ref="range"]{min-width:140px}
.re-ov .re-filterbar .re-input:disabled{color:var(--re-color-text-disabled);cursor:not-allowed}
.re-ov .re-filterbar .re-input:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-fb-err{flex:1 1 100%;display:flex;align-items:flex-start;gap:var(--re-space-3);color:var(--re-color-text);font-size:var(--re-text-sm)}
.re-fb-err svg.u-i{width:15px;height:15px;flex:none;color:var(--re-color-accent-text)}
/* the 11-02 promote: the segment dropdown is a button, the picks and the chevron in it, that opens a menu
   under its right edge: Segment (one pick) and Show only (Mine, Off target and Close with a glyph and the
   count, any mix), each item a check slot and its words */
.re-fb-seg{position:relative;display:flex}
.re-ov .re-fb-segbtn{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;min-width:150px;min-height:32px;margin:0;
  padding:5px 9px;border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice-sm);
  background:var(--re-color-surface-raised);color:var(--re-color-text);font:600 var(--re-text-sm) var(--re-font-ui);cursor:pointer;white-space:nowrap}
.re-ov .re-fb-segbtn:hover{border-color:var(--re-color-border-strong)}
.re-ov .re-fb-segbtn svg.u-i{display:block;flex:none;width:14px;height:14px;stroke-width:2}
.re-fb-menu{position:absolute;z-index:44;top:calc(100% + 6px);right:0;display:flex;flex-direction:column;gap:2px;width:260px;
  max-width:calc(100vw - 16px);padding:var(--re-space-3);border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-container);background:linear-gradient(var(--re-color-surface-raised),var(--re-color-surface-raised)),var(--re-color-bg);
  color:var(--re-color-text);box-shadow:var(--re-shadow-card)}
.re-fb-mh{padding:8px 10px 2px;color:var(--re-color-text-muted);font:700 var(--re-text-xs) var(--re-font-ui);letter-spacing:.06em;text-transform:uppercase}
.re-fb-msep{margin:4px 0;border-top:var(--re-border-width) solid var(--re-color-line)}
.re-ov .re-fb-mi{display:flex;align-items:center;gap:8px;width:100%;min-height:32px;margin:0;padding:4px 10px;border:0;
  border-radius:var(--re-radius-choice-sm);background:none;color:var(--re-color-text);font:600 var(--re-text-sm) var(--re-font-ui);text-align:left;cursor:pointer}
.re-ov .re-fb-mi:hover{background:var(--re-color-surface-hover)}
.re-fb-mck{display:grid;place-items:center;flex:none;width:14px;height:14px}
.re-fb-mck svg.u-i{display:block;width:14px;height:14px;stroke-width:2}
.re-ov .re-fb-mi .re-gl{width:9px;height:9px}
.re-fb-mn{margin-left:auto;color:var(--re-color-text-muted);font-weight:700;font-variant-numeric:tabular-nums}
/* the 10-31 promote: a pressed ladder box as a chip with its close mark, and under 600 wide the bar folded to
   Mine, the count line and Filters, which opens the rest in place */
.re-ov .re-fb-rung{display:inline-flex;align-items:center;gap:6px;min-height:32px;margin:0;padding:5px 11px;
  border:var(--re-border-width) solid var(--re-color-border-strong);border-radius:var(--re-radius-pill);background:var(--re-color-surface-hover);
  color:var(--re-color-text);font:650 var(--re-text-sm) var(--re-font-ui);cursor:pointer;white-space:nowrap}
.re-ov .re-fb-rung svg.u-i{display:block;flex:none;width:13px;height:13px;stroke-width:2}
.re-ov .re-fb-segbtn:focus-visible,.re-ov .re-fb-mi:focus-visible,.re-ov .re-fb-rung:focus-visible,.re-ov .re-fb-tog:focus-visible{
  outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-fb-fold{display:none}
.re-fb-rest{display:contents}
@media (max-width:599.98px){
  /* Quick hits keep one line that scrolls sideways, every pill 44px tall */
  .re-ov .re-topbar-actions{flex:1 1 100%;flex-wrap:nowrap;min-width:0;max-width:100%;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .re-ov .re-topbar .re-qh{flex:none;flex-wrap:nowrap}
  .re-ov .re-topbar .re-qh-btn,.re-ov .re-topbar .re-qh-mcp{flex:none;min-height:44px}
  .re-fb-fold{display:flex;flex:1 1 100%;align-items:center;gap:var(--re-space-4);min-width:0}
  .re-ov .re-fb-fold .re-fb-mine{flex:none;min-height:44px;padding:5px 14px}
  .re-fb-fline{flex:1 1 auto;min-width:0;overflow:hidden;color:var(--re-color-text-meta);font-size:var(--re-text-xs);text-overflow:ellipsis;white-space:nowrap}
  .re-ov .re-fb-tog{display:inline-flex;align-items:center;gap:7px;flex:none;min-height:44px;margin:0;padding:5px 14px;
    border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice-sm);background:var(--re-color-surface-raised);
    color:var(--re-color-text);font:650 var(--re-text-sm) var(--re-font-ui);cursor:pointer;white-space:nowrap}
  .re-ov .re-fb-tog:hover{border-color:var(--re-color-border-strong)}
  .re-ov .re-fb-tog b{font:700 var(--re-text-sm) var(--re-font-ui);font-variant-numeric:tabular-nums}
  .re-ov .re-fb-tog svg.u-i{display:block;flex:none;width:14px;height:14px;stroke-width:2}
  .re-fb-rest:not([data-open]){display:none}
  .re-fb-rest>.re-fb-line,.re-fb-rest .re-fb-mine{display:none}
  .re-ov .re-fb-mi{min-height:44px}
  /* the Urgent bar closed by default, saying how many beside the urgency glyph */
  .re-ov .re-urgent .re-drawer-title,.re-ov .re-urgent .re-drawer-count,.re-ov .re-urgent .re-drawer-note{display:none}
  .re-ov .re-urgent .re-drawer-ph{display:inline-flex}
  /* the Inbox below the roster: the blocks after the roster follow it */
  .re-ov[data-uov]>#re-ov-inbox{order:1}
  .re-ov[data-uov]>#re-ov-drawer,.re-ov[data-uov]>.re-foot{order:2}
}
.re-drawer-ph{display:none;align-items:center;gap:var(--re-space-3);font:700 var(--re-text-140) var(--re-font-ui)}
.re-drawer-ph[data-ink="accent"]{color:var(--re-color-accent-text)}
.re-drawer-ph[data-ink="meta"]{color:var(--re-color-text-meta)}
.re-drawer-ph svg.u-i{display:block;flex:none;width:15px;height:15px;stroke-width:2}
/* closed on every width (the 11-01 promote): the one-line count bar until it opens, then the desktop header */
.re-ov .re-urgent:not([open]) .re-drawer-title,.re-ov .re-urgent:not([open]) .re-drawer-count,.re-ov .re-urgent:not([open]) .re-drawer-note{display:none}
.re-ov .re-urgent:not([open]) .re-drawer-ph{display:inline-flex}

/* the roster: RE Live's label, then the cards on an auto-fill track of
   400px times the text size's scale, or the column split in --re-roster-n
   (six at 100%, four at 200%, set with the scale) when that is wider: four
   across in the 1920 main column at the default size (PROMOTE, 2026-10-21) */
.re-ov-listhead{display:flex;flex-wrap:wrap;align-items:flex-start;gap:14px 18px;margin:22px 0 var(--re-space-5)}
/* RE Live's label is the head's own flex item, as wide as its words
   (PROMOTE, 2026-09-29: the column that held it beside Sort by is gone) */
.re-ov-listcol{display:contents}
.re-ov .re-ov-listlabel{margin:0;color:var(--re-color-text-meta);font:600 var(--re-text-105) var(--re-font-ui);
  letter-spacing:.12em;text-transform:uppercase}
.re-ov-cards{display:grid;gap:var(--re-space-5);grid-template-columns:repeat(auto-fill,minmax(max(min(100%,calc(400px * var(--re-scale,1))),
  calc((100% - (var(--re-roster-n,6) - 1) * var(--re-space-5)) / var(--re-roster-n,6))),1fr))}
/* the card: RE Live's button, its padding the button's own 1px 6px, so the
   stripe sits just inside the edge as RE Live draws it */
.re-ov .re-roster-card{display:grid;grid-template-columns:4px calc(104px * var(--re-scale,1)) minmax(0,1fr);gap:0 12px;align-items:center;
  min-width:0;margin:0;padding:0;border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card);overflow:hidden;color:var(--re-color-text);font:inherit;text-align:left;cursor:pointer}
.re-ov .re-roster-card:hover{border-color:var(--re-color-border-strong)}
.re-ov .re-roster-card:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-rc-stripe{display:block;grid-row:1 / span 2;align-self:stretch}
.re-rc-total{display:flex;flex-direction:column;align-items:stretch;gap:var(--re-space-1);padding:var(--re-space-6) 0}
/* the 10-31 promote: the card leads with Search visibility, the clicks (or Search Console's state in words) and
   their change beside its arrow, then the temperature as a glyph and its word */
.re-ov .re-rc-num{font-size:var(--re-text-400);font-weight:700;line-height:.9;letter-spacing:-0.03em;text-align:center}
.re-ov .re-rc-num[data-fs="300"]{font-size:var(--re-text-300)}
.re-ov .re-rc-num[data-fs="200"]{font-size:var(--re-text-200)}
.re-rc-vnote{display:inline-flex;align-items:center;justify-content:center;gap:4px;font-size:var(--re-text-95);font-weight:600;line-height:1.35;
  text-align:center;text-wrap:balance}
.re-rc-vnote svg.u-i{display:block;flex:none;width:11px;height:11px;stroke-width:2.4}
.re-rc-unit{color:var(--re-color-text-muted);font-size:var(--re-text-95);line-height:1.3;letter-spacing:.08em;text-transform:uppercase;
  text-align:center;text-wrap:balance}
.re-rc-temp{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:0;margin-top:var(--re-space-4);
  font:700 var(--re-text-95) var(--re-font-ui);letter-spacing:.06em;text-transform:uppercase;text-align:center;text-wrap:balance}
.re-rc-temp .re-gl{width:8px;height:8px}
.re-rc-figs{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 14px;color:var(--re-color-text-meta);font-size:var(--re-text-120)}
.re-rc-fig{display:inline-flex;align-items:baseline;gap:5px;min-width:0}
.re-rc-fig b{font:700 var(--re-text-150) var(--re-font-ui);font-variant-numeric:tabular-nums}
.re-rc-fig b[data-fs="120"]{font-size:var(--re-text-120)}
.re-rc-fig b[data-fs="130"]{font-size:var(--re-text-130)}
/* the Analyze row at the card's foot, across the card under the stripe's two rows */
.re-rc-az{grid-column:2 / -1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-3) var(--re-space-5);
  padding:var(--re-space-4) var(--re-space-6) var(--re-space-5) 0;border-top:var(--re-border-width) solid var(--re-color-line)}
#view .re-rc-az .re-btn.re-az-go,#view .re-rc-az .re-btn.re-az-again{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:32px;
  margin:0;padding:var(--re-space-3) 14px;border-radius:var(--re-radius-toggle);font:700 var(--re-text-sm) var(--re-font-ui);cursor:pointer;white-space:nowrap}
#view .re-rc-az .re-btn.re-az-again{padding:var(--re-space-3) 13px;font-weight:650}
#view .re-rc-az .re-mcp-mark{width:15px;height:15px;flex:none}
.re-rc-az [data-ink="accent"]{color:var(--re-color-accent-text)}
.re-rc-az [data-ink="text2"]{color:var(--re-color-text-2)}
.re-rc-az .re-az-note svg.u-i{display:block;flex:none;width:13px;height:13px;stroke-width:2}
@media (max-width:979.98px){#view .re-rc-az .re-btn.re-az-go,#view .re-rc-az .re-btn.re-az-again{min-height:44px}}
.re-rc-body{display:flex;flex-direction:column;gap:7px;min-width:0;padding:var(--re-space-6) var(--re-space-6) var(--re-space-6) 0}
/* the name in a row of its own, as wide as its words (PROMOTE, 2026-10-21) */
.re-rc-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
.re-rc-name{font-size:var(--re-text-220);font-weight:700;line-height:1.15;letter-spacing:-0.02em;overflow-wrap:anywhere;text-wrap:pretty}
/* the channel bar: each channel's share of the items ready in its colour,
   the three labelled columns under it saying which is which and how many */
.re-rc-bar{display:flex;height:8px;background:var(--re-color-line);overflow:hidden}
.re-rc-bar i{display:block;flex:0 0 auto}
.re-rc-chans{display:flex;flex-wrap:wrap;gap:var(--re-space-3) 16px}
.re-rc-chan{display:flex;flex-direction:column;gap:var(--re-space-1);flex:1 1 80px;min-width:0}
.re-rc-chl{display:inline-flex;align-items:center;gap:5px;min-width:0;color:var(--re-color-text-meta);
  font-size:var(--re-text-105);line-height:1.25;letter-spacing:.06em;text-transform:uppercase}
.re-rc-chl i{flex:0 0 auto;width:6px;height:6px}
.re-rc-chv{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 var(--re-space-3);white-space:nowrap}
.re-rc-chv b{font:700 var(--re-text-150) var(--re-font-ui)}
.re-rc-chv b[data-word]{font-size:var(--re-text-120)}
/* the week's delta: the arrow and the signed number, green up, red down, in
   proportional figures as RE Live sets them (the sheet's tabular rule is
   important, so this one is too) */
.re-rc-chd{font-size:var(--re-text-110);font-weight:650;font-variant-numeric:normal!important}
.re-rc-chd svg.re-arrow{display:inline-block;width:12px;height:12px;stroke-width:2.25;vertical-align:-2px;margin-right:1px}
.re-rc-foot{display:flex;align-items:baseline;gap:var(--re-space-2) var(--re-space-4);padding-top:var(--re-space-4);
  border-top:var(--re-border-width) solid var(--re-color-line);font-size:var(--re-text-120)}
.re-rc-line{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.re-rc-verb{font-weight:650}
.re-rc-fn{color:var(--re-color-text-meta)}
/* the issues line's way to Health, at the line's end in the accent */
.re-ov a.re-rc-link{margin-left:auto;color:var(--re-color-accent-text);font-weight:650;white-space:nowrap;text-decoration:none}
/* the indexing line (PROMOTE, 2026-10-21): the warning in the down red and
   the check's words, one line cut at the edge */
.re-rc-idx{display:flex;align-items:center;gap:var(--re-space-3);color:var(--re-color-text-2);font-size:var(--re-text-120)}
.re-rc-idxic{flex:none;color:var(--re-color-down)}
.re-rc-idxic svg.u-i{display:block;width:13px;height:13px;stroke-width:2}
.re-rc-idxw{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* the Connections and Content topics lines (PROMOTE, 2026-11-04): small meta lines under the issues line; the
   topics line is a link to the client's Content topics tab, its count in the accent text */
.re-rc-conn,.re-ov a.re-rc-ct{display:flex;flex-wrap:wrap;align-items:center;font-size:var(--re-text-120);color:var(--re-color-text-meta)}
.re-rc-conn{gap:var(--re-space-2) var(--re-space-4)}
.re-ov a.re-rc-ct{align-self:flex-start;gap:var(--re-space-2) var(--re-space-3);text-decoration:none;text-underline-offset:3px}
.re-ov a.re-rc-ct:hover{text-decoration:underline}
.re-rc-ctl{font-weight:650;color:var(--re-color-text-2)}
.re-rc-ct b{font-weight:700;font-variant-numeric:tabular-nums;color:var(--re-color-accent-text)}
.re-rc-cnone{color:var(--re-color-text-muted)}
/* the Connections count and a glyph per owned source not connected (its name and state as hover text) */
.re-rc-cn{font-weight:700;font-variant-numeric:tabular-nums;color:var(--re-color-text-2)}
.re-rc-cmarks{display:inline-flex;align-items:center;gap:4px}
.re-rc-cmiss{display:inline-flex;color:var(--re-color-text-muted)}
.re-rc-cmiss svg.u-i{width:13px;height:13px;stroke-width:2}
@media (max-width:599.98px){.re-ov a.re-rc-ct{min-height:44px}}
/* RE Live v2's Urgent drawer: red edged while a change is listed, each
   change a tile on the down tint with its glyph, its words, the client,
   pages and first seen, and Open the pages */
.re-ov .re-urgent.re-urgent-on{border-color:var(--re-color-down-border)}
.re-ov .re-urgent.re-urgent-on .re-drawer-title,.re-ov .re-urgent.re-urgent-on .re-drawer-count{color:var(--re-color-down)}
.re-ur-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:var(--re-space-4);padding-top:var(--re-space-2)}
.re-ov a.re-ur-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:var(--re-space-5);align-items:start;padding:12px 40px 12px 14px;
  border:var(--re-border-width) solid var(--re-color-down-border);border-radius:var(--re-radius-container);
  background:var(--re-color-down-tint);color:var(--re-color-text);text-decoration:none}
.re-ov a.re-ur-row:hover{border-color:var(--re-color-down)}
.re-ur-ic{display:grid;place-items:center;width:34px;height:34px;border-radius:var(--re-radius-pill);
  background:var(--re-color-surface-raised);color:var(--re-color-down)}
.re-ur-ic svg.u-i{width:16px;height:16px;stroke-width:2}
.re-ur-body{display:flex;flex-direction:column;gap:3px;min-width:0}
.re-ur-what{color:var(--re-color-down);font-size:var(--re-text-140);font-weight:650}
.re-ur-who{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
.re-ur-client{color:var(--re-color-text);font-size:var(--re-text-135);font-weight:600;overflow-wrap:anywhere}
.re-ur-when{color:var(--re-color-text-meta);font-size:var(--re-text-xs);white-space:nowrap}
.re-ur-sub{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 12px;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-ur-sub>span:first-child{flex:1 1 auto;min-width:0;overflow-wrap:anywhere}
.re-ur-open{display:inline-flex;align-items:center;gap:5px;color:var(--re-color-accent-text);font-weight:650;white-space:nowrap}
.re-ur-open svg.u-i{width:14px;height:14px;stroke-width:2}
/* Design's close x on each Urgent tile, beside its link, and the line of
   the tiles the team dismissed with Bring them back, an underlined word */
.re-ur-tile{position:relative;display:grid}
.re-ur-x{position:absolute;top:8px;right:8px;display:grid;place-items:center;width:28px;height:28px;margin:0;padding:1px 6px;border:0;
  border-radius:var(--re-radius-toggle);background:none;color:var(--re-color-text-muted);font:revert;cursor:pointer}
.re-ur-x:hover{background:var(--re-color-surface-raised);color:var(--re-color-text)}
.re-ur-x svg.u-i{width:14px;height:14px;stroke-width:2}
.re-ur-gone{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-3) var(--re-space-5);margin-top:var(--re-space-4);
  color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-ur-gone b{color:var(--re-color-text-2)}
.re-ur-back{margin:0;padding:2px 0;border:0;background:none;color:var(--re-color-text-2);font:650 var(--re-text-xs) var(--re-font-ui);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.re-ur-x:focus-visible,.re-ur-back:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
/* RE Live's Inbox (PROMOTE, 2026-10-21), 14px under the Urgent drawer: one
   row per signal on the drawer row's line: the client and its lane, the
   score with its glyph, why it surfaced on one line, the strategist and the
   day. The 11-02 promote: a drawer (.re-ov .re-drawer's glass, head and
   body), closed its one bar: Inbox, the shown of total in the text ink (the
   words muted when no row shows), how many unread only once open; beside
   each row Mark read and a dismiss x, a read row's name regular in text-2;
   the dismissed line is the Urgent drawer's (re-ur-gone) */
.re-ib-line{color:var(--re-color-text);font:700 var(--re-text-140) var(--re-font-ui);font-variant-numeric:tabular-nums}
.re-ib-line[data-ink="muted"]{color:var(--re-color-text-muted)}
.re-ov .re-ib:not([open]) .re-ib-unread{display:none}
.re-ib-rows{display:flex;flex-direction:column}
.re-ib-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:var(--re-space-4);box-shadow:0 -1px 0 var(--re-color-line)}
.re-ib-item:hover{background:var(--re-color-surface-hover)}
.re-ov a.re-ib-row{display:grid;grid-template-columns:minmax(140px,.7fr) auto minmax(0,3fr) auto;gap:4px 14px;align-items:center;
  min-width:0;padding:10px 0;color:inherit;text-decoration:none}
.re-ib-who{display:flex;flex-direction:column;min-width:0}
.re-ib-who b{overflow:hidden;color:var(--re-color-text);font:650 var(--re-text-135) var(--re-font-ui);text-overflow:ellipsis;white-space:nowrap}
.re-ib-item[data-read] .re-ib-who b{color:var(--re-color-text-2);font-weight:400}
.re-ib-who span{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-ib-acts{display:flex;align-items:center;gap:var(--re-space-2)}
.re-ib-read{display:inline-flex;align-items:center;min-height:32px;margin:0;padding:0 10px;border:0;border-radius:var(--re-radius-toggle);
  background:none;color:var(--re-color-text-2);font:650 var(--re-text-xs) var(--re-font-ui);white-space:nowrap;cursor:pointer}
/* the x is RE Live's bare button, the browser's own padding and font, as the Urgent tile's x */
.re-ib-x{display:grid;place-items:center;width:32px;height:32px;margin:0;padding:1px 6px;border:0;border-radius:var(--re-radius-toggle);
  background:none;color:var(--re-color-text-muted);font:revert;cursor:pointer}
.re-ib-read:hover,.re-ib-x:hover{background:var(--re-color-surface-raised);color:var(--re-color-text)}
.re-ib-x svg.u-i{display:block;width:14px;height:14px;stroke-width:2}
.re-ib-read:focus-visible,.re-ib-x:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
@media (max-width:599.98px){.re-ib-read{min-height:44px}.re-ib-x{width:44px;height:44px}}
.re-ib-score{display:inline-flex;align-items:center;gap:6px;font:700 var(--re-text-135) var(--re-font-ui);font-variant-numeric:tabular-nums;white-space:nowrap}
.re-ib-score svg.u-i{display:block;width:13px;height:13px;stroke-width:2}
.re-ib-why{min-width:0;overflow:hidden;color:var(--re-color-text-2);font-size:var(--re-text-sm);text-overflow:ellipsis;white-space:nowrap}
.re-ib-when{color:var(--re-color-text-meta);font-size:var(--re-text-xs);white-space:nowrap}
@media (max-width:979.98px){.re-ov a.re-ib-row{grid-template-columns:minmax(0,1fr) auto}}


/* the roster's empty state, RE Live's: what matched none, a hint, Clear filters */
.re-ov .re-empty{display:flex;flex-wrap:wrap;align-items:center;gap:10px var(--re-space-6);padding:22px;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface-inset);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card)}
.re-empty-line{font-size:var(--re-text-140);font-weight:600}
.re-empty-hint{color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
.re-ov .re-empty-clear{display:inline-flex;align-items:center;min-height:32px;margin-left:auto;padding:var(--re-space-3) var(--re-space-5);
  border:var(--re-border-width) solid var(--re-color-accent);border-radius:var(--re-radius-choice-sm);
  background:var(--re-color-accent);color:var(--re-color-on-accent);font:650 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-ov .re-empty-clear:hover{border-color:var(--re-color-accent-hover);background:var(--re-color-accent-hover)}
.re-ov .re-empty-clear:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}

/* a drawer's head and body, the shared base (the pane's drawers set their
   own in their sections; the Overview's are below) */
.re-drawer-head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-4) var(--re-space-5);
  padding:var(--re-space-5) var(--re-space-6);list-style:none;cursor:pointer}
.re-drawer-head::-webkit-details-marker{display:none}
.re-drawer-head:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:-2px}
.re-drawer-head svg[data-chev]{width:14px;height:14px;flex:none;color:var(--re-color-text-muted)}
.re-drawer[open]>.re-drawer-head svg[data-chev]{transform:rotate(90deg)}
.re-drawer-count{color:var(--re-color-text-muted);font-size:var(--re-text-md);font-weight:700}
.re-drawer-note{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-drawer-body{padding:0 var(--re-space-6) var(--re-space-5)}
/* Not in rotation, RE Live's drawer: glass, the chevron, the title, the
   count and why they are out; each row the name and category, the reason
   and the date nobody stores (said as such) and the owner's action */
.re-ov .re-drawer{margin-top:14px;border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-ov .re-drawer-head{align-items:center;gap:var(--re-space-4) var(--re-space-5);padding:13px var(--re-space-6)}
.re-ov .re-drawer-head svg[data-chev]{color:inherit;stroke:var(--re-color-text-muted);stroke-width:2}
.re-ov .re-drawer-title{color:var(--re-color-text-muted);font:700 var(--re-text-xs) var(--re-font-ui);
  letter-spacing:.06em;text-transform:uppercase}
.re-ov .re-drawer-count{color:var(--re-color-text-muted);font:700 var(--re-text-140) var(--re-font-ui)}
.re-ov .re-drawer-note{color:var(--re-color-text-meta);font-size:var(--re-text-120)}
.re-ov .re-drawer-body{padding:0 var(--re-space-6) 14px}
.re-ov .re-nr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:6px 14px;align-items:center;
  padding:var(--re-space-5) 0;box-shadow:0 -1px 0 var(--re-color-line)}
.re-nr-name{display:flex;flex-direction:column;gap:var(--re-space-1);min-width:0}
/* the name is a link to the client (PROMOTE, 2026-10-21) */
.re-ov a.re-nr-n{overflow:hidden;color:var(--re-color-text-2);font-size:var(--re-text-135);font-weight:600;
  text-decoration:none;text-overflow:ellipsis;white-space:nowrap}
.re-ov a.re-nr-n:hover{color:var(--re-color-accent-text)}
.re-nr-seg,.re-nr-since{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-nr-reason{color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
.re-nr-act{display:inline-flex;align-items:center;gap:var(--re-space-5);white-space:nowrap}
.re-nr-btn{display:inline-flex;align-items:center;min-height:30px;margin:0;padding:5px 11px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice-sm);
  background:var(--re-color-surface-raised);color:var(--re-color-text-2);font:650 var(--re-text-120) var(--re-font-ui);cursor:pointer}
.re-nr-btn:hover{border-color:var(--re-color-border-strong);color:var(--re-color-text)}
.re-nr-btn:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-nr-btn:disabled,.re-nr-btn:disabled:hover{border-color:var(--re-color-border);background:var(--re-color-surface);
  color:var(--re-color-text-disabled);cursor:not-allowed}
/* the ask, once, in a row of its own under the row (PROMOTE, 2026-10-21):
   on the down tint with its warning, the question, then the accent's Put
   back or Take out and Cancel */
.re-nr-ask{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-3) var(--re-space-5);padding:9px 14px;
  border:var(--re-border-width) solid var(--re-color-down-border);border-radius:var(--re-radius-container);background:var(--re-color-down-tint)}
.re-nr-q{display:flex;align-items:center;gap:var(--re-space-3);flex:1 1 280px;min-width:0}
.re-nr-q>span:last-child{color:var(--re-color-text);font-size:var(--re-text-135);font-weight:600;text-wrap:pretty}
.re-nr-warn{flex:none;color:var(--re-color-down)}
.re-nr-warn svg.u-i{display:block;width:13px;height:13px;stroke-width:2}
.re-nr-btns{display:flex;gap:var(--re-space-3)}
.re-nr-yes,.re-nr-no{display:inline-flex;align-items:center;justify-content:center;min-height:30px;margin:0;padding:5px 11px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice-sm);
  background:var(--re-color-surface-raised);color:var(--re-color-text-2);font:650 var(--re-text-120) var(--re-font-ui);cursor:pointer;white-space:nowrap}
.re-nr-yes{border-color:var(--re-color-accent);background:var(--re-color-accent);color:var(--re-color-on-accent)}
.re-nr-no:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
.re-nr-yes:focus-visible,.re-nr-no:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
/* Take a client out of rotation (PROMOTE, 2026-10-21): the label, the pick
   and its Gate 1 note, the reason, then Take out, under the drawer's rows */
.re-to{display:grid;grid-template-columns:auto minmax(180px,1fr) minmax(200px,1.4fr) auto;gap:var(--re-space-3) 14px;align-items:start;
  padding:var(--re-space-5) 0 var(--re-space-2);box-shadow:0 -1px 0 var(--re-color-line)}
.re-to-label{padding-top:6px;color:var(--re-color-text-2);font-size:var(--re-text-135);font-weight:600;white-space:nowrap}
.re-to-pick{display:flex;flex-direction:column;gap:4px;min-width:0}
.re-to-note{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-ov .re-to .re-input{width:100%;min-width:0;min-height:32px;margin:0;padding:5px 9px;border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-choice-sm);background:var(--re-color-surface-raised);color:var(--re-color-text);font:600 var(--re-text-sm) var(--re-font-ui)}
.re-ov .re-to select.re-input{cursor:pointer}
.re-ov .re-to .re-input:disabled{opacity:.55;cursor:not-allowed}
.re-ov .re-to .re-input:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-to-btn{justify-content:center;white-space:nowrap}
.re-nr-err{grid-column:1/-1;display:flex;align-items:center;gap:var(--re-space-3);font-size:var(--re-text-sm)}
.re-nr-err svg.u-i{width:14px;height:14px;color:var(--re-color-accent-text)}
.re-ov .re-nr-none{margin:0;padding:var(--re-space-4) 0 var(--re-space-2);color:var(--re-color-text-muted);font-size:var(--re-text-sm)}

/* the legend footer's items, RE Live's lanes: the swatch, the word and the
   count, then the rule in meta */
.re-ov .re-lg-item{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.re-ov .re-lg-item i{width:9px;height:9px}
.re-ov .re-lg-item .re-gl{width:9px;height:9px}
.re-ov .re-lg-rule{color:var(--re-color-text-meta)}
/* RE Live v2's Columns row: the window at the row's end, then Privacy */
.re-ov .re-lg-window{margin-left:auto;white-space:nowrap}
.re-ov a.re-lg-privacy{color:var(--re-color-text-2);font-weight:650}

/* the Overview's buttons outside RE Live's views: #/clients' row action and
   Hide, the rotation ask, the error state's Try again */
.re-ov-primary{display:inline-flex;align-items:center;min-height:32px;padding:var(--re-space-3) var(--re-space-5);
  border:var(--re-border-width) solid var(--re-color-accent);border-radius:var(--re-radius-none);
  background:var(--re-color-accent);color:var(--re-color-on-accent);font-size:var(--re-text-sm);font-weight:600}
.re-ov-primary:hover{background:var(--re-color-accent-hover)}
.re-ov-ghost{display:inline-flex;align-items:center;min-height:32px;padding:var(--re-space-3) var(--re-space-5);
  border:var(--re-border-width) solid var(--re-color-border-strong);border-radius:var(--re-radius-none);
  background:none;color:var(--re-color-text-2);font-size:var(--re-text-sm);font-weight:600}
.re-ov-ghost:hover{color:var(--re-color-text);border-color:var(--re-color-border-control)}
.re-ov-primary:focus-visible,.re-ov-ghost:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:2px}
.re-ov-btn{display:inline-flex;align-items:center;gap:var(--re-space-3);min-height:32px;
  padding:var(--re-space-3) var(--re-space-5);border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-none);background:var(--re-color-surface-raised);color:var(--re-color-text);
  font-size:var(--re-text-sm);font-weight:600}
.re-ov-btn:hover{border-color:var(--re-color-border-strong)}
.re-ov-btn:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:2px}
.re-ov-btn:disabled{color:var(--re-color-text-disabled);border-color:var(--re-color-border);background:var(--re-color-surface);cursor:not-allowed}

/* #/clients: the Overview's list, the System's compact row 1A. Each row, the
   header included, is its own grid, so every track is a fixed length or a
   share of the width over a fixed floor, as in row 1A, where the action has
   its own fixed track: twelve text bases, which grows with the text size
   and is the same in the header, whose own type is smaller. The owner's
   Hide beside each action takes the wider track. */
.re-ov-list{border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface);overflow-x:auto}
.re-lr{display:grid;grid-template-columns:minmax(180px,1.3fr) 130px 84px minmax(140px,1fr) minmax(130px,1fr) calc(var(--re-base) * 12);
  gap:var(--re-space-7);align-items:center;min-height:58px;padding:var(--re-space-4) var(--re-space-6);
  border-top:var(--re-border-width) solid var(--re-color-line);cursor:pointer}
.re-ov-list-hide .re-lr{grid-template-columns:minmax(180px,1.3fr) 130px 84px minmax(140px,1fr) minmax(130px,1fr) calc(var(--re-base) * 15.5)}
.re-lr:hover{background:var(--re-color-surface-hover)}
.re-lr-head{min-height:0;border-top:0;cursor:default;color:var(--re-color-text-meta);font-family:var(--re-font-data);
  font-size:var(--re-text-xs);font-weight:600;letter-spacing:.1em;text-transform:uppercase}
.re-lr-head:hover{background:none}
.re-lr-head span:nth-child(3){text-align:center}
.re-lr-client{display:flex;flex-direction:column;gap:var(--re-space-1);min-width:0}
.re-lr-name{color:var(--re-color-text);font-size:var(--re-text-md);font-weight:600;
  text-decoration:none;overflow-wrap:anywhere}
.re-lr-name:hover{text-decoration:underline}
.re-lr-name:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:2px}
.re-lr-where{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-lr-review{text-align:center}
.re-lr-review b{color:var(--re-color-status-needs);font-size:var(--re-text-lg);font-weight:700}
.re-lr-wait{display:flex;flex-direction:column;gap:var(--re-space-2);min-width:0;font-size:var(--re-text-sm)}
.re-lr-waitt{display:flex;align-items:baseline;gap:var(--re-space-3)}
.re-lr-waitt span{color:var(--re-color-text-muted)}
/* the waiting bar (row 1A): the oldest wait against four times the wait
   line, the notch at a quarter, on the line itself; the days in words above
   it carry the meaning, the bar only shows it */
.re-lr-bar{position:relative;display:block;width:100%;max-width:220px;height:4px;background:var(--re-color-line)}
.re-lr-bar i{display:block;height:100%;background:var(--re-color-accent)}
.re-lr-bar b{position:absolute;left:25%;top:-3px;bottom:-3px;width:2px;background:var(--re-color-text-muted)}
.re-muted .re-lr-bar i{background:var(--re-color-border-strong)}
.re-spark{display:block;width:100%;max-width:220px;height:28px}
/* a neutral count's line in the accent, as the Outreach home draws its own:
   green is for up and positive (UI port QA fix 2) */
.re-spark polyline{fill:none;stroke:var(--re-color-accent);stroke-width:1.75;vector-effect:non-scaling-stroke}
.re-muted .re-spark polyline{stroke:var(--re-color-border-strong)}
.re-lr-act{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:var(--re-space-3)}
/* the row's action is a link, and the page's older sheet gives every link
   in a view its parent's colour (.u-view a), which outranks the primary's
   own colour: a link drawn with the accent fill names its on-accent colour
   again at a weight that beats that rule */
.re-lr-act a.re-ov-primary,a.re-btn.re-ov-primary{color:var(--re-color-on-accent);text-decoration:none}
.re-lr-nm{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-ov .re-zero{color:var(--re-color-text-meta);font-weight:400}
.re-lr-review b.re-zero{font-size:var(--re-text-sm)}
.re-muted .re-lr-name{color:var(--re-color-text-muted)}
.re-muted .re-lr-review b{color:var(--re-color-text-meta)}
/* the status (the list's column and the pane): its glyph and its word, always together */
.re-status{display:inline-flex;align-items:center;gap:var(--re-space-3);font-size:var(--re-text-sm);
  font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--re-color-text-2)}
.re-status svg.u-i{width:15px;height:15px;flex:none}
.re-status[data-status="needs_you"]{color:var(--re-color-status-needs)}
.re-status[data-status="quiet"]{color:var(--re-color-status-quiet)}
.re-status[data-status="on_track"]{color:var(--re-color-status-ok)}
/* a month against the month before (the pane's uGV): a number and an arrow,
   green up, red down, "same" in meta */
.re-delta{display:inline-flex;align-items:center;gap:var(--re-space-1);font-size:var(--re-text-xs);font-weight:600}
.re-delta svg.re-arrow{width:11px;height:11px;stroke-width:2.2}
.re-delta-up{color:var(--re-color-up)}
.re-delta-down{color:var(--re-color-down)}
.re-delta-same,.re-delta-none{color:var(--re-color-text-meta);font-weight:400}

/* skeletons while the first read loads: blocks the size of the blocks they
   stand in for (the motion section pulses re-skeleton) */
.re-skeleton{display:block;background:var(--re-color-surface-hover)}
.re-ov-sktop{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-5)}
.re-sk-title{width:260px;max-width:100%;height:30px}
.re-sk-meta{width:180px;max-width:100%;height:14px}
.re-sk-kpi{height:96px}
.re-ov-skfilter{margin:22px 0 14px}
.re-sk-filter{height:56px}
.re-sk-card{height:156px}
.re-sk-kpi,.re-sk-filter,.re-sk-card{border-radius:var(--re-radius-container)}

/* the System's error state: a warning glyph, what failed, a way to try again */
.re-ov-err{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-5) var(--re-space-6);
  padding:var(--re-space-7);border:var(--re-border-width) solid var(--re-color-accent);border-radius:var(--re-radius-container);
  background:var(--re-color-surface)}
.re-ov-err svg.u-i{width:18px;height:18px;color:var(--re-color-accent-text);flex:none}
.re-ov-errtext{display:flex;flex-direction:column;gap:var(--re-space-2);flex:1 1 280px;min-width:0}
/* its headline sets its own size, as every word RE Live draws does (RELIVE
   fix round: it was the Overview's one text that took the column's size) */
.re-ov-errtext b{font-size:var(--re-text-md)}
.re-ov-errtext span{color:var(--re-color-text-muted);font-size:var(--re-text-sm)}

/* 760px and below (the 2026-09-18 rule, carried by the headline boxes): a
   team login sees the first client card's name on the first screen at 390
   by 844, so the boxes sit two across on a smaller minimum track, stack
   their numeral over the words, and keep the number, the label and the word
   while the detail and the definition go */
@media (max-width:760px){
  .re-ov .re-filterbar{gap:var(--re-space-3) var(--re-space-5);padding:var(--re-space-4) var(--re-space-5)}
  .re-ov .re-roster-card{grid-template-columns:4px 76px minmax(0,1fr);gap:0 var(--re-space-5)}
  .re-ov .re-rc-num{font-size:var(--re-text-400)}
  .re-rc-body{padding:var(--re-space-5) var(--re-space-5) var(--re-space-5) 0}
  .re-rc-name{font-size:var(--re-text-180)}
  .re-rc-unit{white-space:normal}
  .re-rc-chl{letter-spacing:0;text-transform:none;overflow-wrap:normal}
  .re-ov .re-nr,.re-to{grid-template-columns:minmax(0,1fr)}
  .re-nr-btns{flex-direction:column;width:100%}
  .re-nr-act{flex-wrap:wrap;white-space:normal}
  .re-ov .re-lg-item{white-space:normal}
  .re-lr,.re-ov-list-hide .re-lr{grid-template-columns:minmax(0,1fr) auto;gap:var(--re-space-3) var(--re-space-5)}
  .re-lr-head{display:none}
  .re-lr-review,.re-lr-caught{text-align:left}
  .re-lr-act{grid-column:1/-1;justify-content:flex-start}
}
/* RE Live's tabular numerals on the Overview (the figures rule at the top of
   the sheet starts RE Live's views from normal): the headline boxes, the
   to-review badge, the card total and its channel counts, and the drawer's
   count (important: these rules set type with the font shorthand, which
   resets the figures) */
#re-ov-kpis .re-kpi-num,.re-ov .re-fb-badge b,.re-ov .re-rc-num,.re-ov .re-rc-chv>b,.re-ov .re-drawer-count{
  font-variant-numeric:tabular-nums!important}
/* page:home end */

/* View fixes (UI port 3b): the older views inside the new main column.
   Their help and feed text stops near 90 characters too, however wide the
   column is. */
#cform label,.card .why,.card .snip,.card .scorewhy,.card .title,.ls-lede{max-width:90ch}

/* page:pane-content start */
/* RE Live: the pane's chrome, the detail-mode main column and the Content
   tab (RELIVE, 2026-09-26: RE Live.dc.html's own markup and inline styles,
   written here as rules on the same tokens; the values RE Live writes by
   hand, a 14px pad or a 650 weight, are written as it writes them).

   Phone widths first (4b fix 1): at 760px and below, with the largest text
   size, a topic row's side (the novelty chip, the thumbs and Draft ping) ran
   past its card, because it was a flex row that never wrapped. It wraps
   under the topic now, a button's words wrap before the button runs past
   its row, the Proactive, Reactive and Seasonal links wrap, and a ping's
   value and note fields (drawn on the Content and Updates tabs) keep inside
   their row. */
@media (max-width:760px){
  .u-topicside{flex-wrap:wrap;justify-content:flex-start;gap:var(--re-space-4)}
  .u-topicside>.u-rowacts{min-width:0}
  .u-topicside .u-btn{white-space:normal;min-width:0;max-width:100%;text-align:left}
  .u-subtabs{display:flex;flex-wrap:wrap}
  .u-attr .u-inp{min-width:0;max-width:100%}
}
/* The pane's chrome, shared by every tab: the shell's close button sits at
   the top right and the header row runs beside it (Clients / <name>, the
   search in RE Live's pill, Build report and the next step), then the
   search note, RE Live's glass strip of tabs and the one tab panel. */
.re-pane-hdr{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-5);margin-bottom:14px}
.re-pane-crumb{min-width:0;color:var(--re-color-text-meta);font-size:var(--re-text-130);overflow-wrap:anywhere}
.re-pane-crumb b{color:var(--re-color-text);font-weight:600}
/* RE Live v2: Clients is the way back to the Overview, in the crumb's colour */
.re-pane-crumb a{color:inherit;text-decoration:none}
.re-pane-crumb a:hover{color:var(--re-color-accent-text)}
.re-pane-hdr .re-search{display:flex;align-items:center;gap:var(--re-space-4);flex:1 1 160px;min-width:0;max-width:280px;
  margin-left:auto;padding:7px var(--re-space-5);border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-pill);background:var(--re-color-surface-raised);color:var(--re-color-text-meta);
  font-size:var(--re-text-sm);white-space:nowrap;overflow:hidden;backdrop-filter:none;-webkit-backdrop-filter:none}
.re-pane-hdr .re-search:focus-within{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-search-ic{display:inline-grid;place-items:center;flex:none}
.re-search-ic svg.u-i{width:14px;height:14px;stroke-width:1.75}
/* the field itself is bare inside its pill, on the pill's line: the page's
   form rules (an input that is not a checkbox, radio or range) weigh more
   than one class */
.re-pane-hdr .re-search input[type="search"].re-search-input{flex:1 1 auto;min-width:0;min-height:0;height:auto;margin:0;padding:0;
  border:0;border-radius:0;background:none;box-shadow:none;color:var(--re-color-text);font:inherit;line-height:inherit;outline:none}
.re-search-input::placeholder{color:var(--re-color-text-meta);opacity:1}
.re-pane-hdr .re-pane-btn{display:inline-flex;align-items:center;min-height:34px;margin:0;padding:7px 14px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice);
  background:var(--re-color-surface-raised);color:var(--re-color-text);font:inherit;font-size:var(--re-text-130);font-weight:600;
  white-space:nowrap;text-decoration:none;cursor:pointer}
.re-pane-hdr .re-pane-btn:hover{border-color:var(--re-color-border-strong)}
.re-pane-cta{display:inline-flex;align-items:center;gap:7px;min-height:34px;padding:7px 14px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice);background:var(--re-color-surface-raised);
  color:var(--re-color-text-2);font-size:var(--re-text-130);font-weight:650;white-space:nowrap;text-decoration:none}
/* the 10-31 promote: the next step is outlined, so the Analyze act is the client page's one filled act; the
   older sheet's link rule for a view (.u-view a) outranks one class, so the link names its own ink */
a.re-btn.re-pane-cta{color:var(--re-color-text-2)}
a.re-btn.re-pane-cta:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
#pane .re-btn.re-pane-cta:active:not(:disabled){background-color:var(--re-color-surface-raised);border-color:var(--re-color-border-strong)}
.re-pane-cta svg.u-i{width:14px;height:14px;stroke:currentColor;stroke-width:2}
.re-pane-btn:focus-visible,.re-pane-cta:focus-visible,.re-tab:focus-visible,.re-back:focus-visible{
  outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-pane-searchnote{margin:0 0 var(--re-space-4);color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-tabs{position:relative;clear:both;display:flex;flex-wrap:wrap;gap:var(--re-space-3);margin-bottom:18px;padding:5px;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface-inset);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card)}
/* RE Live's glide (PROMOTE, 2026-09-29): the picked tab's gold is the strip's
   one highlight, laid under it by the script (reGlide) and sliding to a new
   pick; a tab is its muted face and its dark face on one spot (the faces'
   opacity is the shell's glide rule), and the hover fill is an unpicked
   tab's only */
.re-tabs>[data-ind]{position:absolute;left:0;top:0;width:0;height:0;border-radius:var(--re-radius-choice);
  background:var(--re-color-accent);transform-origin:0 0;pointer-events:none}
.re-tabs .re-tab{position:relative;display:grid;min-height:36px;margin:0;padding:7px 14px;border:0;
  border-radius:var(--re-radius-choice);background:none;color:revert;font:650 var(--re-text-130) var(--re-font-ui);
  text-decoration:none;cursor:pointer}
.re-tabs .re-tab>[data-off],.re-tabs .re-tab>[data-on]{grid-area:1/1;display:inline-flex;align-items:center;gap:var(--re-space-4)}
.re-tabs .re-tab>[data-off]{color:var(--re-color-text-muted);font-weight:600}
.re-tabs .re-tab>[data-off]:hover{color:var(--re-color-text)}
.re-tabs .re-tab>[data-on]{color:var(--re-color-on-accent)}
.re-tabs .re-tab svg.u-i{width:15px;height:15px}
.re-tabs .re-tab:not([data-sel="true"]):hover{background:var(--re-color-surface-raised)}
.re-tab-count{padding:1px 7px;border-radius:var(--re-radius-pill);background:var(--re-color-line);color:var(--re-color-text-2)}
.re-tab [data-on] .re-tab-count{background:var(--re-color-accent-count);color:inherit}
.re-tabpanels{min-width:0}
.re-tabpanel [data-re-hit="0"]{display:none!important}
/* skeleton blocks, each the size of the block it stands in for: a flat fill
   (the pulse is the motion section's) */
.re-skeleton{display:block;background:var(--re-color-surface-hover);border-radius:var(--re-radius-container)}
.re-skel-pill{width:120px;height:32px;border-radius:var(--re-radius-pill)}
.re-skel-col{min-height:112px}
.re-skel-todo{min-height:180px}
.re-skel-row{min-height:52px;margin:0 var(--re-space-5)}
.re-skel-tab{min-height:320px}
/* the System's error: what did not load, why, and Try again */
.re-err{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-4) var(--re-space-6);padding:var(--re-space-7);
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface);color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
.re-err b{color:var(--re-color-text);font-weight:600}
.re-err .re-pane-btn{display:inline-flex;align-items:center;min-height:32px;padding:var(--re-space-3) var(--re-space-5);
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice-sm);
  background:var(--re-color-surface-raised);color:var(--re-color-text);font:inherit;font-weight:600;cursor:pointer}

/* The main column while the pane is open (RE Live's isDetail block, PROMOTE
   2026-09-29): the client column and Switch client, drawn in page:pane-reddit.
   .re-detail fills the column and may be shorter than its rows, so the
   switch list takes what the client column leaves and scrolls its rows on
   its own, as RE Live's does. All clients is RE Live's pill. The trend inks are the pane's
   (the Reddit card's month): up green with an arrow, down red with an arrow,
   level a flat line in the text colour, the words saying which. */
.re-detail{display:flex;flex-direction:column;flex:1 1 auto;min-width:0;min-height:0}
.re-detail .re-back{display:inline-flex;align-items:center;gap:var(--re-space-4);align-self:flex-start;min-height:32px;margin:0;
  padding:var(--re-space-3) var(--re-space-5);border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-pill);
  background:var(--re-color-surface-raised);color:var(--re-color-text-muted);font:600 var(--re-text-120) var(--re-font-ui);cursor:pointer}
.re-detail .re-back:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
.re-detail .re-back svg.u-i{width:13px;height:13px;stroke-width:2}
.re-t-up{color:var(--re-color-up)}
.re-t-down{color:var(--re-color-down)}
.re-t-flat{color:var(--re-color-text)}
.re-t-none{color:var(--re-color-text-meta)}
/* words where a number is not measured, in the numeral's slot */
.re-detail .re-words{color:var(--re-color-text-muted);font-size:var(--re-text-md);font-weight:600;letter-spacing:0;line-height:inherit}
/* the team's client tools (rePaneTools), heading the Findings route's
   panel, since RE Live's detail column and tabs draw none: when the data
   last changed with Refresh now, Copy client link, Triage sprint, Full
   feed, Pin, and the two working views RE Live's cards open */
.re-detail-tools{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-3) var(--re-space-6);margin:0 0 var(--re-space-6);
  padding-bottom:14px;border-bottom:var(--re-border-width) solid var(--re-color-line);color:var(--re-color-text-muted);font-size:var(--re-text-120)}
.re-detail-tools .u-updline{flex:1 1 100%;margin:0;color:var(--re-color-text-meta);font-size:inherit}
.re-detail-tools .u-linkbtn{color:var(--re-color-text-muted);font-size:inherit;font-weight:600;text-decoration:none}
.re-detail-tools .u-linkbtn:hover{color:var(--re-color-text)}
/* The pane's drawers (To do, Proof for the report and the lane rows): RE Live's
   glass card as a details element, its summary the chevron, the title and
   a quiet note. The chevron points right, and down while the drawer is
   open (a state, not a motion: the motion section turns it). */
.re-pane-inner .re-card.re-drawer{margin:0 0 var(--re-space-5);border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-pane-inner .re-drawer-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;padding:18px var(--re-space-7);
  cursor:pointer;list-style:none}
.re-pane-inner .re-drawer-head::-webkit-details-marker{display:none}
.re-pane-inner .re-drawer-head:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:calc(-1 * var(--re-focus-width))}
.re-pane-inner .re-drawer-head svg.u-i[data-chev]{flex:none;width:15px;height:15px;color:inherit;stroke:var(--re-color-text-meta);stroke-width:2}
.re-pane-inner .re-drawer[open]>.re-drawer-head svg.u-i[data-chev]{transform:rotate(90deg)}
.re-pane-inner .re-drawer-title{margin:0;color:var(--re-color-text);font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em;
  line-height:inherit}
.re-pane-inner .re-drawer-note{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-pane-inner .re-drawer-body{padding:0 var(--re-space-7) var(--re-space-7)}

/* The Content tab (RE Live's tabContent card): the head (Content topics,
   its note and the unseen count at the right, amber while there is one),
   then one row per topic on the row fill with a hairline edge: the topic,
   one line of its source signal cut at the edge (a click opens the full
   list), when it was found or "Date not recorded" with its counts, and the
   row's own controls at the right. The topics screen's sub-tabs, filters,
   pings and briefs keep their places inside the card. */
.re-pane-inner .re-card.re-content{margin-bottom:var(--re-space-5);padding:var(--re-space-7);border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-card-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) 14px}
.re-card-top h2{margin:0;color:var(--re-color-text);font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em;line-height:inherit}
.re-card-note{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-content-n{margin-left:auto;color:var(--re-color-accent-text);font-size:var(--re-text-200);font-weight:700}
.re-content-n.re-zero{color:var(--re-color-text-meta)}
.re-pane-inner .re-content .u-subtabs{margin:var(--re-space-6) 0 0}
.re-pane-inner .re-content-body{margin-top:var(--re-space-5)}
.re-pane-inner .re-content .u-stack{display:flex;flex-direction:column;gap:9px}
.re-pane-inner .re-content .u-card.u-topic{display:grid;grid-template-columns:minmax(0,1fr);gap:14px;margin:0;padding:13px 14px;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:0;background:var(--re-color-surface-row);
  box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.re-pane-inner .re-content .u-card.u-topic:hover{border-color:var(--re-color-border-strong)}
.re-pane-inner .re-content .u-topic [data-pingslot]:empty{display:none}
.re-pane-inner .re-content .u-topicrow{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px}
.re-topic-main{display:flex;flex-direction:column;gap:var(--re-space-3);min-width:0}
/* RE Live's toggle: the topic, its one line of signal and its date */
.re-pane-inner .re-content .re-topic-toggle{display:flex;flex-direction:column;gap:3px;min-width:0;margin:0;padding:0;border:0;
  background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.re-topic-title{font-size:var(--re-text-140);font-weight:600;text-wrap:pretty}
.re-pane-inner .re-content .u-topic .u-m{margin:0;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-topic-date{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
/* a topic's note: one line of its source signal, cut at the edge; open, it
   reads in full, and the list of its conversations shows under the row */
.re-note{display:block;max-width:100%;color:var(--re-color-text-meta);font-size:var(--re-text-120);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.re-topic-toggle[aria-expanded="true"] .re-note{color:var(--re-color-text-2);line-height:1.5;white-space:normal;text-wrap:pretty}
.re-topic-toggle:hover .re-topic-title{color:var(--re-color-accent-text)}
.re-topic-toggle:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-note-full{margin:0;padding-left:var(--re-space-7);color:var(--re-color-text-2);font-size:var(--re-text-120)}
.re-note-full[hidden]{display:none!important}
/* RE Live Client's Content topics card drawn in v3 (the bare tab,
   reContentCard; PROMOTE, 2026-10-25): its rows on the row fill 8px apart,
   each the toggle (the label, the source titles cut at the edge in text-2,
   when it was found) and Plan post, the outlined re-btn; none says so */
.re-pane-inner .re-content .re-topics{display:flex;flex-direction:column;gap:var(--re-space-4);margin-top:var(--re-space-6)}
.re-pane-inner .re-content .re-row.re-topic-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--re-space-2) 14px;align-items:start;
  padding:13px 15px;background:var(--re-color-surface-row);border:var(--re-border-width) solid var(--re-color-border)}
.re-pane-inner .re-content .re-topics .re-topic-title{color:var(--re-color-text);font-size:var(--re-text-135);font-weight:600;overflow-wrap:anywhere}
.re-pane-inner .re-content .re-topic-from{color:var(--re-color-text-meta);font-weight:500}
.re-pane-inner .re-content .re-topics .re-note{color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-pane-inner .re-content .re-topics .re-topic-toggle[aria-expanded="true"] .re-note{line-height:inherit;text-wrap:wrap}
.re-pane-inner .re-content .re-topic-date[data-none]{color:var(--re-color-text-muted)}
.re-pane-inner .re-content a.re-btn.re-topic-plan{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:32px;margin:0;
  padding:var(--re-space-3) 13px;border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-toggle);
  background:var(--re-color-surface-raised);color:var(--re-color-text-2);font:650 var(--re-text-sm) var(--re-font-ui);white-space:nowrap;text-decoration:none}
.re-pane-inner .re-content a.re-btn.re-topic-plan:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
.re-pane-inner .re-content .re-topics-none{max-width:none;margin:0;padding:0;color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
/* RE Live (2026-11-04): the unseen count as a pill at the head's right, the accent while there is one; a topic
   with no buyer question says so muted; See all opens the client's topics tab */
.re-content-chip{margin-left:auto;display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:var(--re-radius-pill);
  border:var(--re-border-width) solid var(--re-color-border-control);color:var(--re-color-text-muted);font:700 var(--re-text-130) var(--re-font-ui);
  font-variant-numeric:tabular-nums}
.re-content-chip[data-ink="accent"]{border-color:var(--re-color-accent);color:var(--re-color-accent-text)}
.re-pane-inner .re-content .re-topics .re-note[data-none]{color:var(--re-color-text-muted)}
.re-pane-inner .re-content a.re-topics-all{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;min-height:32px;
  color:var(--re-color-text-2);font:650 var(--re-text-sm) var(--re-font-ui)}
.re-pane-inner .re-content a.re-topics-all:hover{color:var(--re-color-text)}
.re-topics-all svg.u-i{width:12px;height:12px;stroke-width:2.2}
@media (max-width:760px){.re-pane-inner .re-content a.re-topics-all{min-height:44px}}
/* topics-ui-1105: each topic's answer status (a glyph and a word, the page linked) and source count under the
   toggle, and the proof it opens in place across the row: the buyer phrasings, then each source item */
/* RE Working Client's Content tab (Nov 5): a chevron left of the title that turns when the row opens, the meta line
   and the proof under the title's edge, the proof an inset box, the status words semibold */
.re-pane-inner .re-content .re-topic-row .re-topic-toggle{position:relative;padding-left:20px}
.re-topic-chev{position:absolute;left:0;top:3px;display:inline-flex;color:var(--re-color-text-meta)}
.re-topic-chev svg.u-i{width:13px;height:13px;stroke-width:2.2}
.re-topic-toggle[aria-expanded="true"] .re-topic-chev{transform:rotate(90deg)}
.re-topic-row .re-topic-meta{padding-left:20px}
.re-topic-row .re-topic-proof{margin-left:20px}
.re-topic-meta{grid-column:1;display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-2) 14px;
  color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-topic-ans{display:inline-flex;align-items:center;gap:6px;color:var(--re-color-text);font-weight:600}
.re-topic-ans svg.u-i{width:13px;height:13px;flex:none}
.re-topic-ans[data-ans="full"] svg.u-i{color:var(--re-color-status-ok)}
.re-topic-ans[data-ans="part"] svg.u-i,.re-topic-ans[data-ans="none"] svg.u-i{color:var(--re-color-accent-text)}
.re-topic-ans[data-ans="unk"]{color:var(--re-color-text-muted);font-weight:500}
.re-topic-ans a,.re-topic-proof a{color:var(--re-color-accent-text);overflow-wrap:anywhere}
.re-topic-proof{grid-column:1/-1;display:flex;flex-direction:column;gap:var(--re-space-2);
  padding:var(--re-space-4) var(--re-space-5);background:var(--re-color-surface-inset);border-radius:var(--re-radius-choice);
  color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-topic-proof[hidden]{display:none!important}
.re-topic-proof b{color:var(--re-color-text);font-weight:600}
.re-topic-qs,.re-topic-src{margin:0;padding-left:var(--re-space-7);display:flex;flex-direction:column;gap:4px}
.re-topic-where,.re-topic-more,.re-topic-gone{color:var(--re-color-text-meta);font-size:var(--re-text-xs);margin:0}
.u-topic .re-topic-proof{padding:0;background:none}
/* a ping's text fills its row in the pane */
.re-pane-inner .u-pingbox{width:100%;max-width:90ch}
/* RE Live's tabular numerals in the detail column and the pane (the figures
   rule at the top of the sheet starts RE Live's views from normal): the
   client column's To do counts, the switch rows' counts, the tab counts,
   the ledger, the waiting bands, a thread's score, the To do chips and
   counts, the month legend, columns and totals, the Content count, a lane's
   count and the proof figures (important: the sheets set type with the font
   shorthand, which resets the figures) */
.re-detail .re-col-n,.re-detail .re-sw-rev,#pane .re-tab-count,#pane .re-ledger-value,#pane .re-band,
#pane .re-th-score,#pane .re-chip,#pane .re-chip-n,#pane .re-todo-n,#pane .re-mo-key b,#pane .re-mo-fig,#pane .re-mo-fig *,
#pane .re-mo-side b,#pane .re-content-n,#pane .re-out-lane-n,#pane .re-proof-value{font-variant-numeric:tabular-nums!important}
/* RE Live Client's Content ideas card (PROMOTE, 2026-10-21), over the
   Content topics card: the title, what it holds and the card's count, the
   sources line, then one row per idea on the row fill: the buyer question
   and title, the kind in caps and its line, the three grounding pairs, the
   owner and the day, and at the row's end the open button (the accent) with
   See the prompt under it, or the Chosen line with the open-again button and
   See the prompt outlined; the prompt opens in the row, under it */
#pane .re-card.re-ci{margin-bottom:var(--re-space-5);padding:var(--re-space-7);border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-ci-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) 14px}
#pane .re-ci-top h2{margin:0;font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em}
.re-ci-note{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-ci-n{margin-left:auto;font-size:var(--re-text-200);font-weight:700;font-variant-numeric:tabular-nums}
.re-ci-src{display:block;margin-top:var(--re-space-2);color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-ci-rows{display:flex;flex-direction:column;gap:9px;margin-top:var(--re-space-6)}
.re-ci-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:start;padding:13px 14px;
  border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface-row)}
.re-ci-main{display:flex;flex-direction:column;gap:9px;min-width:0}
.re-ci-q{display:flex;flex-direction:column;gap:3px}
.re-ci-q>span:first-child{font-size:var(--re-text-140);font-weight:600;text-wrap:pretty}
.re-ci-q>span:last-child{color:var(--re-color-text-2);font-size:var(--re-text-130);text-wrap:pretty}
.re-ci-kind{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-2) 10px;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-ci-kind b{color:var(--re-color-text-2);font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.re-ci-ground{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px 14px}
.re-ci-ground>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.re-ci-gl{color:var(--re-color-text-meta);font-size:var(--re-text-100);letter-spacing:.08em;text-transform:uppercase}
.re-ci-ground a,.re-ci-ground>span>span:not(.re-ci-gl){font-size:var(--re-text-sm);overflow-wrap:anywhere;text-decoration:none}
.re-ci-who{display:flex;flex-wrap:wrap;gap:var(--re-space-2) 14px;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-ci-acts{display:flex;flex-direction:column;align-items:flex-end;gap:7px;min-width:0}
#pane .re-btn.re-ci-primary,#pane .re-btn.re-ci-second{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:32px;margin:0;
  padding:var(--re-space-3) 14px;border:0;border-radius:var(--re-radius-toggle);background:var(--re-color-accent);color:var(--re-color-on-accent);
  font:700 var(--re-text-sm) var(--re-font-ui);white-space:nowrap;cursor:pointer}
#pane .re-btn.re-ci-second{padding:var(--re-space-3) 13px;border:var(--re-border-width) solid var(--re-color-border-control);
  background:var(--re-color-surface-raised);color:var(--re-color-text-2);font-weight:650}
#pane .re-btn.re-ci-second:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
/* the copy's prompt toggle and open-tab buttons carry no glyph and no gap; the repeat-open button keeps its 7px */
#pane .re-btn.re-ci-second[data-do="see"],#pane .re-btn.re-ci-second[data-do="tab"]{gap:normal}
.re-ci-acts svg.u-i,.re-ci-btns svg.u-i{width:13px;height:13px;stroke-width:2}
.re-ci-acts .re-mcp-mark,.re-ci-btns .re-mcp-mark{width:15px;height:15px;flex:none}
#pane .re-ci-primary .re-mcp-mark g{fill:var(--re-color-on-accent)}
.re-ci-see{align-self:flex-end;margin:0;padding:2px 0;border:0;background:none;color:var(--re-color-text-2);
  font:650 var(--re-text-xs) var(--re-font-ui);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.re-ci-chosen{display:inline-flex;align-items:center;gap:6px;color:var(--re-color-accent-text);font-size:var(--re-text-xs);font-weight:650}
.re-ci-chosen svg.u-i{width:14px;height:14px;stroke-width:2}
.re-ci-btns{display:flex;flex-wrap:wrap;gap:7px;justify-content:flex-end}
.re-ci-panel{grid-column:1/-1;display:flex;flex-direction:column;gap:10px;max-width:760px;min-width:0;padding:12px 0 2px;
  border-top:var(--re-border-width) solid var(--re-color-border)}
.re-ci-panel>b{color:var(--re-color-text);font:650 var(--re-text-135) var(--re-font-ui)}
.re-ci-pl{color:var(--re-color-text-2);font-size:var(--re-text-sm);line-height:1.5;text-wrap:pretty}
.re-ci-first{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-2) 12px;padding:10px 12px;
  border:var(--re-border-width) dashed var(--re-color-border-control);color:var(--re-color-text-2);font-size:var(--re-text-sm);line-height:1.5}
.re-ci-first>span{flex:1 1 220px;min-width:0;text-wrap:pretty}
.re-ci-panel pre{margin:0;max-height:calc(12 * 1.5em);overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;padding:10px 12px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-toggle);background:var(--re-color-surface);
  font:500 var(--re-text-sm)/1.5 ui-monospace,Menlo,Consolas,monospace}
.re-ci-panel .re-ci-btns{justify-content:flex-start}
.re-ci-none{padding:14px 15px;border:var(--re-border-width) dashed var(--re-color-border-control);color:var(--re-color-text-meta);
  font-size:var(--re-text-sm);line-height:1.5}
.re-ci [data-ink="text"]{color:var(--re-color-text)}
.re-ci [data-ink="muted"]{color:var(--re-color-text-muted)}
.re-ci [data-ink="accent"]{color:var(--re-color-accent-text)}
.re-ci [data-ink="meta"]{color:var(--re-color-text-meta)}
.re-btn.re-ci-primary:focus-visible,.re-btn.re-ci-second:focus-visible,.re-ci-see:focus-visible,.re-ci-panel pre:focus-visible{
  outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
@media (max-width:979.98px){
  .re-ci-row{grid-template-columns:minmax(0,1fr)}
  .re-ci-acts{align-items:stretch}
  .re-ci-see{align-self:flex-start}
  .re-ci-btns{flex-direction:column}
  #pane .re-btn.re-ci-primary,#pane .re-btn.re-ci-second{width:100%;min-height:44px}
}
/* page:pane-content end */

/* page:pane-outreach start */
/* RE Live: Detail pane, Outreach tab (UI port 4b, the PANE slice), and the
   outreach views beside it: #/outreach, #/outreach-home and the contact
   queue, which draw the same rows.

   Phone widths first (4b fix 1): the Outreach home's client buttons
   ("<client>: <n> waiting") and every other button in a row's actions let
   their words wrap instead of running past the column, and the decision
   chips and the note editor wrap too. */
@media (max-width:760px){
  [data-uoh] .u-rowacts>.u-btn,[data-uoview] .u-rowacts>.u-btn,[data-ucq] .u-rowacts>.u-btn,
  [data-uclient] .u-rowacts>.u-btn,.re-pane-inner .u-rowacts>.u-btn{
    white-space:normal;min-width:0;max-width:100%;text-align:left}
  .u-decide-btns,.u-noteedit{display:flex;flex-wrap:wrap}
  .u-noteedit .u-inp{min-width:0;max-width:100%}
}
/* The Outreach tab: one choice per tactic lane with its count, each row's
   missing reach, cost and deadline said in words, the private pitch drawn
   under its row to read (nothing sends), and the brand mentions with their
   link state as a glyph and a word. */
.re-lanes{display:flex;flex-wrap:wrap;gap:var(--re-space-3);margin:0 0 var(--re-space-5)}
.re-lane-n{margin-left:var(--re-space-2);color:var(--re-color-text-meta);font-weight:700}
/* a pressed chip fills amber with on-accent words, and its count and its
   note go with them (UI port QA fix 2): meta grey on the fill read 2.07:1
   dark and 1.04:1 light */
.u-chip[aria-pressed="true"] .re-lane-n,.u-chip[aria-pressed="true"] .u-ghost{color:inherit}
.re-missing{color:var(--re-color-text-meta)}
.re-pitch{display:flex;flex-direction:column;gap:var(--re-space-3);margin-top:var(--re-space-4);padding:var(--re-space-5);
  border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface-inset)}
.re-bm{margin-top:var(--re-space-5)}
.re-rows{display:flex;flex-direction:column}
.re-rows>.re-bm-row{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:var(--re-space-3) var(--re-space-6);
  padding:var(--re-space-5) 0;border-top:var(--re-border-width) solid var(--re-color-line)}
.re-bm-main{min-width:0;flex:1 1 20em}
.re-bm-outlet{color:var(--re-color-text);font-weight:700}
.re-link-st{display:inline-flex;align-items:center;gap:var(--re-space-3);color:var(--re-color-text-2);
  font-size:var(--re-text-sm);font-weight:700}
.re-link-st svg.u-i{width:14px;height:14px}
.re-link-unknown{color:var(--re-color-text-meta);font-weight:600}
/* In the pane a table of rows reads as the Design's row cards at every
   width: the title first on its own line, then each cell with its label
   (the phone layout the page already uses, kept for the pane's width). */
.re-pane-inner table.u-t.u-cards thead{display:none}
.re-pane-inner table.u-t.u-cards,.re-pane-inner table.u-t.u-cards tbody,.re-pane-inner table.u-t.u-cards tr,
.re-pane-inner table.u-t.u-cards td{display:block;width:100%}
.re-pane-inner table.u-t.u-cards tr{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-2) var(--re-space-5);
  padding:var(--re-space-5) 0;border-bottom:var(--re-border-width) solid var(--re-color-line)}
.re-pane-inner table.u-t.u-cards td{display:inline-flex;flex-wrap:wrap;align-items:center;column-gap:var(--re-space-2);width:auto;
  min-width:0;padding:0;border:0;color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
.re-pane-inner table.u-t.u-cards td.u-title{order:-1;flex-basis:100%;display:block;padding-bottom:var(--re-space-2);
  color:var(--re-color-text);font-size:var(--re-text-md)}
.re-pane-inner table.u-t.u-cards td.u-actcell,.re-pane-inner table.u-t.u-cards tr.u-fitrow>td{flex-basis:100%;display:block}
.re-pane-inner table.u-t.u-cards td.u-n{text-align:left}
.re-pane-inner table.u-t.u-cards td[data-label]:not(.u-title)::before{content:attr(data-label);padding-right:var(--re-space-2);
  color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:600;
  letter-spacing:.08em;text-transform:uppercase}
/* THE PANE'S OUTREACH TAB (RELIVE, 2026-09-26: RE Live's tabOutreach cards,
   scoped to the pane; #/outreach keeps the table above). The card: its
   head, the filters and the CSV, RE Live's tactic lanes (the picked one
   filled in the accent, a lane with nothing to review in meta), the lane's
   head with its count, the rows to review on the row fill with Approve and
   Dismiss, then Saved to the lane: the approved rows as glass cards, each
   with its stage as a swatch and a word (Pitch ready amber, Pitched blue,
   Placed green, Passed muted) and Curate pitch. A row's other controls sit
   behind its More. Then Brand mentions and links: each row's link as a
   swatch and a word, Linked green, No link muted, the check's own words in
   meta. */
.re-pane-inner .re-card.re-outreach,.re-pane-inner .re-card.re-brand{margin-bottom:var(--re-space-5);padding:var(--re-space-7);
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card)}
.re-out-head{margin-bottom:14px}
.re-out-filters{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--re-space-4) var(--re-space-5);
  margin-bottom:var(--re-space-5)}
.re-out-lanes{display:flex;flex-wrap:wrap;gap:var(--re-space-4);margin-bottom:18px}
.re-pane-inner .re-out-lane{display:inline-flex;align-items:center;gap:var(--re-space-4);min-height:34px;margin:0;padding:7px 13px;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-choice);background:var(--re-color-surface);
  color:var(--re-color-text);font:650 var(--re-text-sm) var(--re-font-ui);white-space:nowrap;cursor:pointer}
.re-pane-inner .re-out-lane.re-out-empty{color:var(--re-color-text-meta)}
.re-pane-inner .re-out-lane[aria-pressed="true"]{border-color:var(--re-color-accent);background:var(--re-color-accent);color:var(--re-color-on-accent)}
.re-out-lane-n{color:var(--re-color-text-meta);font:700 var(--re-text-sm) var(--re-font-ui)}
.re-out-lane[aria-pressed="true"] .re-out-lane-n{color:var(--re-color-on-accent-soft)}
.re-out-lane:focus-visible,.re-out-approve:focus-visible,.re-out-dismiss:focus-visible,.re-out-curate:focus-visible{
  outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-out-sub{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-3) var(--re-space-5);margin-bottom:10px}
.re-out-sub h3{margin:0;color:var(--re-color-text);font-size:var(--re-text-135);font-weight:650;line-height:inherit}
.re-out-subnote{color:var(--re-color-text-meta);font-size:var(--re-text-120)}
.re-out-count{margin-left:auto;color:var(--re-color-text-meta);font-size:var(--re-text-110);letter-spacing:.08em;text-transform:uppercase}
.re-out-sub.re-out-savedhead{margin:var(--re-space-7) 0 10px;padding-top:var(--re-space-6);border-top:var(--re-border-width) solid var(--re-color-line)}
.re-out-rows{display:flex;flex-direction:column;gap:var(--re-space-4)}
.re-pane-inner .re-row.re-out-row,.re-pane-inner .re-row.re-bm-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;
  gap:10px var(--re-space-6);padding:13px 15px;border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface-row)}
.re-pane-inner .re-row.re-bm-row{padding:var(--re-space-5) 15px}
.re-out-main{display:flex;flex-direction:column;gap:var(--re-space-2);min-width:0}
.re-bm-row .re-out-main{gap:3px}
.re-out-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-2) 10px}
.re-out-outlet{color:var(--re-color-text);font:700 var(--re-text-135) var(--re-font-ui)}
.re-pane-inner .re-out-title{color:var(--re-color-text-2);font-size:var(--re-text-130);text-decoration:none;text-wrap:pretty}
.re-pane-inner .re-out-title:hover{color:var(--re-color-accent-text)}
.re-out-meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-2) 14px;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-out-acts{display:flex;align-items:center;gap:var(--re-space-4)}
.re-pane-inner .re-out-approve{min-height:32px;margin:0;padding:var(--re-space-3) 14px;border:0;border-radius:var(--re-radius-toggle);
  background:var(--re-color-accent);color:var(--re-color-on-accent);font:700 var(--re-text-sm) var(--re-font-ui);white-space:nowrap;cursor:pointer}
.re-pane-inner .re-out-approve:hover{background:var(--re-color-accent-hover)}
.re-pane-inner .re-out-dismiss{min-height:32px;margin:0;padding:var(--re-space-3) var(--re-space-5);
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-toggle);background:var(--re-color-surface-raised);
  color:var(--re-color-text-muted);font:600 var(--re-text-sm) var(--re-font-ui);white-space:nowrap;cursor:pointer}
.re-pane-inner .re-out-dismiss:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
.re-out-none{padding:14px 15px;border:var(--re-border-width) dashed var(--re-color-border-control);color:var(--re-color-text-meta);
  font-size:var(--re-text-sm)}
.re-pane-inner .re-card.re-out-saved{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px var(--re-space-6);
  padding:var(--re-space-5) 15px;border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface-inset);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card)}
.re-out-stage{display:inline-flex;align-items:center;gap:7px;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-out-stage i{flex:0 0 auto;width:7px;height:7px;background:var(--re-color-text-muted)}
.re-out-stage b{color:var(--re-color-text-muted);font:700 var(--re-text-xs) var(--re-font-ui)}
.re-stg-ready i{background:var(--re-color-accent-text)}
.re-stg-ready b{color:var(--re-color-accent-text)}
.re-stg-pitched i{background:var(--re-color-channel-content)}
.re-stg-pitched b{color:var(--re-color-channel-content)}
.re-stg-placed i{background:var(--re-color-up)}
.re-stg-placed b{color:var(--re-color-up)}
.re-pane-inner .re-out-curate{display:inline-flex;align-items:center;gap:7px;min-height:32px;margin:0;padding:var(--re-space-3) 13px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-toggle);background:var(--re-color-surface-raised);
  color:var(--re-color-text);font:inherit;font-size:var(--re-text-sm);font-weight:650;white-space:nowrap;cursor:pointer}
.re-pane-inner .re-out-curate:hover{border-color:var(--re-color-border-strong)}
.re-out-curate svg.u-i{width:14px;height:14px}
.re-out-pitch:empty{display:none}
.re-out-more{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-out-more>summary{display:inline-flex;cursor:pointer;color:var(--re-color-text-muted);font-weight:600;list-style:none}
.re-out-more>summary::-webkit-details-marker{display:none}
.re-out-more>summary:hover{color:var(--re-color-text)}
.re-out-more>summary:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-out-more-body{display:flex;flex-direction:column;gap:var(--re-space-3);margin-top:var(--re-space-3)}
.re-out-more-body .u-rowacts{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-3)}
.re-out-left{margin-top:var(--re-space-6);color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-bm-when{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-bm-st{display:inline-flex;align-items:center;gap:7px;color:var(--re-color-text-meta);font:700 var(--re-text-120) var(--re-font-ui);white-space:nowrap}
.re-bm-st i{flex:0 0 auto;width:7px;height:7px;background:currentColor}
.re-bm-linked{color:var(--re-color-up)}
.re-bm-nolink{color:var(--re-color-text-muted)}
/* a link nobody has checked reads in RE Live's No link grey, its words
   saying which (never the colour alone) */
.re-bm-unknown{color:var(--re-color-text-muted)}
@media (max-width:760px){
  .re-pane-inner .re-row.re-out-row,.re-pane-inner .re-card.re-out-saved,.re-pane-inner .re-row.re-bm-row{grid-template-columns:minmax(0,1fr)}
  .re-out-acts{flex-wrap:wrap}
}
/* RE Live Client's Outreach tab (PROMOTE, 2026-10-21): one card, the title,
   its note and the card's count, then one row per pitch on the row fill:
   the outlet bold and the request, the deadline, the contact and the client
   approval in meta, and the stage at the row's end */
#pane .re-card.re-op{margin-bottom:var(--re-space-5);padding:var(--re-space-7);border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-op-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) 14px;margin-bottom:14px}
#pane .re-op-head h2{margin:0;font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em}
.re-op-note{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-op-n{margin-left:auto;font-size:var(--re-text-200);font-weight:700;font-variant-numeric:tabular-nums}
.re-op-n[data-ink="accent"]{color:var(--re-color-accent-text)}
.re-op-n[data-ink="meta"]{color:var(--re-color-text-meta)}
#pane .re-row.re-op-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px var(--re-space-6);align-items:center;
  margin-bottom:var(--re-space-4);padding:13px 15px;border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface-row)}
.re-op-main{display:flex;flex-direction:column;gap:var(--re-space-2);min-width:0}
.re-op-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-2) 10px}
.re-op-top b{font:700 var(--re-text-135) var(--re-font-ui)}
.re-op-top span{color:var(--re-color-text-2);font-size:var(--re-text-130);text-wrap:pretty}
.re-op-meta{display:flex;flex-wrap:wrap;gap:var(--re-space-2) 14px;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-op-due{font-weight:650}
.re-op-stage{color:var(--re-color-text-2);font-size:var(--re-text-120);font-weight:650}
.re-op-none{padding:14px 15px;border:var(--re-border-width) dashed var(--re-color-border-control);color:var(--re-color-text-meta);
  font-size:var(--re-text-sm);line-height:1.5}
@media (max-width:979.98px){#pane .re-row.re-op-row{grid-template-columns:minmax(0,1fr)}}
/* page:pane-outreach end */

/* page:pane-reporting start */
/* RE Live: Detail pane, Reporting tab (RELIVE, 2026-09-26: RE Live's
   tabReport drawer). Proof for the report: six tiles on the row fill with a
   hairline edge, a label, the figure in RE Live's size and its ink, and a
   note; then the value contract's status and the strategy written for the
   client, then the month's report as the older block draws it. */
.re-pane-inner .re-proof{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:10px}
.re-pane-inner .re-proof-tile{display:flex;flex-direction:column;gap:5px;padding:var(--re-space-6);
  border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface-row)}
.re-proof-label{min-height:2.4em;color:var(--re-color-text-meta);font-size:var(--re-text-110);letter-spacing:.1em;line-height:1.35;
  text-transform:uppercase}
.re-pane-inner .re-proof-value{color:var(--re-color-text);font-size:var(--re-text-220);font-weight:700;letter-spacing:-0.02em;
  line-height:inherit}
.re-pane-inner .re-proof-value.re-zero{color:var(--re-color-text-meta)}
.re-pane-inner .re-proof-value.re-t-up{color:var(--re-color-up)}
.re-pane-inner .re-proof-value.re-t-down{color:var(--re-color-down)}
.re-pane-inner .re-proof-value.re-words{color:var(--re-color-text-muted);font-size:var(--re-text-md);font-weight:600;letter-spacing:0}
.re-proof-note{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-strategy{display:flex;flex-direction:column;gap:var(--re-space-3);margin:0 0 var(--re-space-5);padding:var(--re-space-6) var(--re-space-7);
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card);color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-strategy p{margin:0}
.re-strategy-track b{color:var(--re-color-text);font-weight:650}
/* the older renderers' big figures, the Findings tiles and the month block
   (UI port QA fix 2): a real zero prints small and in meta, as the proof
   tiles above do */
.u-big.u-num.re-zero{color:var(--re-color-text-meta);font-size:var(--re-text-lg);font-weight:600;letter-spacing:0}
/* RE Live Client's Reporting tab drawn in v3 (the pane's, PROMOTE 2026-10-25): the month bar (Month, Up to, Open
   report in the accent and Copy JSON link outlined), What we caught beside What we did and What it is worth on
   the glass, each figure its label, its value in RE Live's size and ink (a zero small in meta, none in words)
   and the month before with its arrow, then Worked examples; one column at 760px and below */
.re-rp-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-4) var(--re-space-5);margin-bottom:var(--re-space-5)}
.re-rp-pick{display:flex;align-items:center;gap:var(--re-space-4);margin:0}
.re-rp-pick>span,.re-rp-exh{color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.re-pane-inner .re-rp-pick .re-input{min-height:32px;margin:0;padding:5px 9px;border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-choice-sm);background:var(--re-color-surface-raised);color:var(--re-color-text);font:600 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-rp-upto{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-rp-acts{display:flex;flex-wrap:wrap;gap:7px;margin-left:auto}
.re-pane-inner .re-btn.re-rp-open,.re-pane-inner .re-btn.re-rp-copy{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:32px;margin:0;
  padding:var(--re-space-3) 14px;border:0;border-radius:var(--re-radius-toggle);background:var(--re-color-accent);color:var(--re-color-on-accent);
  font:700 var(--re-text-sm) var(--re-font-ui);white-space:nowrap;text-decoration:none;cursor:pointer}
.re-pane-inner .re-btn.re-rp-open:hover{color:var(--re-color-on-accent)}
.re-pane-inner .re-btn.re-rp-copy{padding:var(--re-space-3) 13px;border:var(--re-border-width) solid var(--re-color-border-control);
  background:var(--re-color-surface-raised);color:var(--re-color-text-2);font-weight:650}
.re-pane-inner .re-btn.re-rp-copy:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
.re-rp-acts svg.u-i{width:13px;height:13px;stroke-width:2}
.re-rp-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:var(--re-space-5);align-items:start;margin-bottom:var(--re-space-6)}
.re-pane-inner .re-card.re-rp-card{min-width:0;padding:var(--re-space-7);border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-pane-inner .re-rp-card h2{margin:0;font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em}
.re-rp-side{display:flex;flex-direction:column;gap:var(--re-space-5);min-width:0}
.re-rp-figs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px;margin-top:var(--re-space-6)}
.re-rp-fig{display:flex;flex-direction:column;gap:3px;min-width:0}
.re-rp-label{color:var(--re-color-text-2);font-size:var(--re-text-sm);font-weight:600}
.re-rp-n{font-size:var(--re-text-240);font-weight:700;line-height:1.15;letter-spacing:-0.02em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.re-rp-n[data-fs="lg"]{font-size:var(--re-text-300)}
.re-rp-n[data-fs="sm"]{font-size:var(--re-text-170);font-weight:650}
.re-rp-n[data-fs="words"]{font-size:var(--re-text-135);font-weight:650}
.re-rp-live{font-size:var(--re-text-240);font-weight:700;line-height:1.15;font-variant-numeric:tabular-nums}
.re-rp-live[data-fs="words"]{font-size:var(--re-text-135);font-weight:600}
.re-rp-grid [data-ink="text"]{color:var(--re-color-text)}
.re-rp-grid [data-ink="meta"]{color:var(--re-color-text-meta)}
.re-rp-grid [data-ink="muted"]{color:var(--re-color-text-muted)}
.re-rp-cmp{display:inline-flex;align-items:center;gap:4px;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-rp-cmp svg.u-i{width:12px;height:12px;stroke-width:2.2}
.re-rp-note{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-rp-lanes{display:flex;flex-wrap:wrap;gap:var(--re-space-2) 18px;margin-top:var(--re-space-6);padding-top:var(--re-space-4);
  border-top:var(--re-border-width) solid var(--re-color-line);font-size:var(--re-text-sm)}
.re-rp-lanes>span{display:inline-flex;align-items:baseline;gap:6px}
.re-rp-lanes>span>span{color:var(--re-color-text-2)}
.re-rp-lanes b{font-weight:700;font-variant-numeric:tabular-nums}
.re-rp-fb{margin:var(--re-space-4) 0 0;color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-rp-worth{display:flex;flex-direction:column;gap:14px;margin-top:var(--re-space-6)}
.re-rp-pill{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 12px}
.re-rp-pill>span:last-child{padding:1px 8px;border:var(--re-border-width) dashed var(--re-color-border-control);border-radius:var(--re-radius-pill);
  color:var(--re-color-text-muted);font-size:var(--re-text-xs);font-weight:600}
.re-rp-ex-wrap{display:flex;flex-direction:column;gap:12px;margin-bottom:var(--re-space-5)}
.re-rp-exh{padding-bottom:var(--re-space-3);border-bottom:var(--re-border-width) solid var(--re-color-border-strong)}
.re-rp-exs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.re-pane-inner .re-row.re-rp-ex{display:flex;flex-direction:column;gap:6px;min-width:0;padding:12px 14px;border:var(--re-border-width) solid var(--re-color-border);
  background:var(--re-color-surface-row)}
.re-rp-exhead{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.re-rp-exhead>a{min-width:0;font:650 var(--re-text-135) var(--re-font-ui);overflow-wrap:anywhere}
.re-rp-score{flex:none;padding:0 7px;border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-pill);
  font:700 var(--re-text-xs)/1.6 var(--re-font-ui);font-variant-numeric:tabular-nums}
.re-rp-score[data-ink="accent"]{color:var(--re-color-accent-text)}
.re-rp-score[data-ink="text2"]{color:var(--re-color-text-2)}
.re-rp-done{color:var(--re-color-text-2);font-size:var(--re-text-sm);text-wrap:pretty}
.re-rp-meta{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-rp-none{margin-bottom:var(--re-space-5);padding:14px 15px;border:var(--re-border-width) dashed var(--re-color-border-control);
  color:var(--re-color-text-meta);font-size:var(--re-text-sm);line-height:1.5}
.re-rp-ex-wrap .re-rp-none{margin-bottom:0}
.re-rp-none b{display:block;color:var(--re-color-text-2);font-weight:650}
.re-rp-open:focus-visible,.re-rp-copy:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
@media (max-width:760px){
  .re-rp-grid,.re-rp-figs,.re-rp-exs{grid-template-columns:minmax(0,1fr)}
}
/* 4a: the monthly report's heading under Findings (the 10-30 promote) */
#pane .re-rp-h{margin:var(--re-space-7) 0 14px;font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em}
/* page:pane-reporting end */

/* page:pane-updates start */
/* RE Live: Detail pane, Updates tab (RELIVE, 2026-09-26: RE Live's
   tabUpdate drawers). The To do list: RE Live's chips (All, then each group
   with something in it; the picked one filled in the accent with a check),
   then one row per task on a hairline: a glyph, the count, what it is with
   why, and where it opens. The lane rows: one row per watched lane on the
   row fill, its state's glyph in a box and its word in the state's ink (OK
   green, Dry amber, Off red, Unchecked meta). Then the log. */
.re-todo-chips{display:flex;flex-wrap:wrap;gap:var(--re-space-4);margin-bottom:14px}
.re-pane-inner .re-todo-chips .re-chip{display:inline-flex;align-items:center;gap:var(--re-space-3);min-height:32px;margin:0;
  padding:5px var(--re-space-5);border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-pill);
  background:none;color:var(--re-color-text-muted);font:600 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-pane-inner .re-todo-chips .re-chip:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
.re-pane-inner .re-todo-chips .re-chip[aria-pressed="true"]{border-color:var(--re-color-accent);background:var(--re-color-accent);
  color:var(--re-color-on-accent);font-weight:650}
.re-pane-inner .re-todo-chips .re-chip svg.u-i{width:13px;height:13px;stroke:var(--re-color-on-accent);stroke-width:2.25}
.re-pane-inner .re-todo-chips .re-chip:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-todo,.re-health{display:flex;flex-direction:column}
.re-pane-inner .re-todo>.re-todo-row{display:grid;grid-template-columns:26px 48px minmax(0,1fr) auto;align-items:center;gap:14px;
  padding:13px var(--re-space-3);box-shadow:0 -1px 0 var(--re-color-line);color:var(--re-color-text);
  text-decoration:none}
.re-pane-inner .re-todo>.re-todo-row:hover{background:var(--re-color-surface-hover);color:var(--re-color-text)}
.re-todo-row:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:calc(-1 * var(--re-focus-width))}
.re-todo-ic{display:grid;place-items:center;color:var(--re-color-text-meta)}
.re-todo-ic svg.u-i{width:16px;height:16px}
.re-pane-inner .re-todo-n{color:var(--re-color-text);font-size:var(--re-text-220);font-weight:700;line-height:1;text-align:right}
.re-todo-what{display:flex;flex-direction:column;gap:3px;min-width:0}
.re-todo-t{font-size:var(--re-text-140);font-weight:600}
.re-todo-note{color:var(--re-color-text-meta);font-size:var(--re-text-120)}
.re-todo-go{display:inline-flex;align-items:center;gap:5px;color:var(--re-color-text-meta);font-size:var(--re-text-sm);font-weight:600;
  white-space:nowrap}
.re-todo-go svg.u-i{width:15px;height:15px}
.re-todo-empty{padding:18px var(--re-space-3);color:var(--re-color-text-meta);font-size:var(--re-text-130)}
.re-pane-inner .re-card.re-drawer.re-health-drawer{margin-bottom:0}
.re-pane-inner .re-health{gap:var(--re-space-4)}
.re-pane-inner .re-health>.re-health-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:14px;
  padding:13px 14px;border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface-row)}
.re-health-ic{display:grid;place-items:center;width:26px;height:26px;background:var(--re-color-line);color:var(--re-color-text-meta)}
.re-health-ic svg.u-i{width:14px;height:14px}
.re-health-main{display:flex;flex-direction:column;gap:var(--re-space-1);min-width:0}
.re-health-name{font-size:var(--re-text-135);font-weight:600}
.re-health-note{color:var(--re-color-text-meta);font-size:var(--re-text-120)}
.re-health-st{color:var(--re-color-text-meta);font-size:var(--re-text-sm);font-weight:650}
.re-hs-ok .re-health-ic,.re-hs-ok .re-health-st{color:var(--re-color-up)}
.re-hs-dry .re-health-ic,.re-hs-dry .re-health-st{color:var(--re-color-accent-text)}
.re-hs-off .re-health-ic,.re-hs-off .re-health-st{color:var(--re-color-down)}
.re-pane-inner .re-card.re-log{margin-top:var(--re-space-5);padding:18px var(--re-space-7) var(--re-space-7);
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card)}
.re-log-head{margin:0 0 var(--re-space-5);color:var(--re-color-text);font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em;
  line-height:inherit}
.re-pane-inner .re-log .u-updlist{margin:0}
@media (max-width:760px){
  .re-pane-inner .re-todo>.re-todo-row{grid-template-columns:26px minmax(0,1fr) auto}
  .re-pane-inner .re-todo-n{text-align:left}
  .re-todo-go{grid-column:2/-1}
}
/* page:pane-updates end */

/* page:pane-reddit start */
/* RE Live: Detail pane, Reddit tab (UI port Step 5). The Reddit card: its
   head (the word, the window, the newest catch at the right), the ledger's
   three cells split by hairlines, and the waiting line whose band words
   always print: the older two bands in the accent text with a clock or a
   warning glyph, never red, never a colour alone. */
.re-reddit{margin-bottom:var(--re-space-5);border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface)}
.re-card-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-3) var(--re-space-5);padding:var(--re-space-7) var(--re-space-7) 0}
.re-card-head h2{margin:0;color:var(--re-color-text);font-size:var(--re-text-lg);font-weight:600}
.re-card-sub{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-card-aside{margin-left:auto;color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-ledger{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:var(--re-border-width);
  margin-top:var(--re-space-6);border-top:var(--re-border-width) solid var(--re-color-line);
  border-bottom:var(--re-border-width) solid var(--re-color-line);background:var(--re-color-line)}
.re-ledger-cell{display:flex;flex-direction:column;gap:var(--re-space-1);padding:var(--re-space-6) var(--re-space-7);background:var(--re-color-surface-row)}
.re-ledger-value{color:var(--re-color-text);font-size:var(--re-text-300);font-weight:700;
  letter-spacing:-0.03em;line-height:1.15}
.re-ledger-value.re-zero{color:var(--re-color-text-meta);font-size:var(--re-text-lg);font-weight:600}
.re-ledger-value.re-words{color:var(--re-color-text-muted);font-size:var(--re-text-md);font-weight:600;letter-spacing:0}
.re-ledger-label{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-ledger-sub{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-waitline{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-3) var(--re-space-6);padding:var(--re-space-5) var(--re-space-7);
  border-bottom:var(--re-border-width) solid var(--re-color-line);font-size:var(--re-text-sm)}
.re-waitline b{color:var(--re-color-text);font-weight:600}
.re-bands{display:contents}
.re-band{display:inline-flex;align-items:center;gap:var(--re-space-2)}
.re-band svg.u-i{width:13px;height:13px}
.re-band-under,.re-wait-none{color:var(--re-color-text-meta)}
.re-band-mid,.re-band-past{color:var(--re-color-accent-text);font-weight:600}
.re-thread-bar{padding:var(--re-space-5) var(--re-space-7) 0}
.re-reddit #urtable{padding:0 var(--re-space-7) var(--re-space-5)}
/* The thread rows: the score (the accent text at the act-today band, a
   number always), the title, "r/<sub>, <age> old", and the state at the
   right, Review with an eye or Cooling with a clock while it waits on us;
   hover is the hover fill. The row's actions and its Suggested fit sit
   under the title. */
.re-thread-bar .u-chips{margin-bottom:var(--re-space-3)}
.re-threads{display:flex;flex-direction:column}
.re-threads>.re-thread{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:baseline;gap:var(--re-space-5);
  padding:var(--re-space-5) var(--re-space-3);border-top:var(--re-border-width) solid var(--re-color-line)}
.re-threads>.re-thread:hover{background:var(--re-color-surface-hover)}
.re-th-score{color:var(--re-color-text);font-size:var(--re-text-lg);font-weight:700;text-align:right}
.re-th-hi .re-th-score{color:var(--re-color-accent-text)}
.re-th-main{min-width:0}
.re-thread-title{color:var(--re-color-text);font-size:var(--re-text-md);font-weight:600;
  line-height:1.45;text-decoration:none;overflow-wrap:anywhere}
.re-thread-title:hover{text-decoration:underline}
.re-thread-title:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:2px}
.re-th-meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-3) var(--re-space-5);margin-top:var(--re-space-1);
  color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-th-status{align-self:start}
.re-th-st{display:inline-flex;align-items:center;gap:var(--re-space-2);color:var(--re-color-accent-text);
  font-size:var(--re-text-sm);font-weight:600}
.re-th-st svg.u-i{width:14px;height:14px}
.re-th-acts{margin-top:var(--re-space-3)}
.re-threads>.re-thread>.re-th-extra{grid-column:2;min-width:0}
.re-th-extra:empty{display:none}
.re-reasons{display:flex;flex-wrap:wrap;gap:var(--re-space-2);flex-basis:100%}
.re-reasons[hidden]{display:none!important}
.re-seeall{display:inline-flex;align-items:center;gap:var(--re-space-2);margin:var(--re-space-5) 0 0 var(--re-space-3);
  color:var(--re-color-accent-text);font-size:var(--re-text-sm);font-weight:600;text-decoration:none}
.re-seeall:hover{text-decoration:underline}
.re-seeall svg.u-i{width:14px;height:14px}
@media (max-width:760px){
  .re-threads>.re-thread{grid-template-columns:28px minmax(0,1fr)}
  .re-th-status{grid-column:2}
}
/* Month over month: the head (the month's acted-on line, the change on
   the month before with an arrow and its number, teal up and grey down),
   the legend (each line's shape, its word and its total), the chart, the
   figures under each month and the side panel of totals. A gap in a line
   is a month that was not tracked. */
.re-months{display:grid;grid-template-columns:minmax(0,1fr) 172px;margin-bottom:var(--re-space-5);
  border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface)}
.re-mo-main{min-width:0;padding:var(--re-space-7)}
.re-mo-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-3) var(--re-space-5)}
.re-mo-head h2{margin:0;color:var(--re-color-text);font-size:var(--re-text-lg);font-weight:600}
.re-mo-line{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-mo-change{display:inline-flex;align-items:center;gap:var(--re-space-2);margin-left:auto;font-size:var(--re-text-sm);
  font-weight:600}
.re-mo-change svg.u-i{width:13px;height:13px;stroke-width:2.25}
.re-mo-up{color:var(--re-color-up)}
.re-mo-down{color:var(--re-color-down)}
.re-mo-level{color:var(--re-color-text-meta);font-weight:400}
.re-mo-legend{display:flex;flex-wrap:wrap;gap:var(--re-space-3) var(--re-space-7);margin-top:var(--re-space-5);
  color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-mo-key b{color:var(--re-color-text);font-weight:700}
.re-mo-key i{display:inline-block;width:14px;height:0;margin-right:var(--re-space-3);vertical-align:middle;
  border-top:2px solid var(--re-color-text)}
.re-mo-key-acted i{border-top-color:var(--re-color-accent)}
.re-mo-key-acted b{color:var(--re-color-accent-text)}
.re-mo-key-active i{border-top:2px dashed var(--re-color-text-muted)}
/* Acted on is told from Posts found by its shape as well as its amber (the
   two solid lines are 1.52:1 apart in lightness in dark, UI port QA fix 1):
   its points are squares, in the chart and on its legend swatch, while
   Posts found keeps round points and Still active its dash. */
.re-mo-key i{position:relative}
.re-mo-key-acted i::after{content:"";position:absolute;left:4px;top:-4px;width:6px;height:6px;background:var(--re-color-accent)}
.re-mo-chart{display:block;width:100%;height:150px;margin-top:var(--re-space-5)}
.re-mo-chart polyline,.re-mo-chart path{fill:none;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.re-mo-chart .re-mo-pt{stroke-width:6}
.re-mo-found{stroke:var(--re-color-text)}
.re-mo-acted{stroke:var(--re-color-accent)}
.re-mo-active{stroke:var(--re-color-text-muted);stroke-dasharray:5 4}
.re-mo-chart .re-mo-active.re-mo-pt{stroke-dasharray:none}
.re-mo-chart .re-mo-acted.re-mo-pt{stroke-linecap:square}
.re-mo-cols{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:var(--re-space-3);margin-top:var(--re-space-4);text-align:center}
.re-mo-m{display:block;color:var(--re-color-text-meta);font-size:var(--re-text-xs);letter-spacing:.08em;text-transform:uppercase}
.re-mo-fig{color:var(--re-color-text);font-size:var(--re-text-sm);font-weight:700}
/* the slash between the found count and the acted-on figure is the one
   separator that is not a colour (an acted-on count differs from found by
   its amber alone), so it reads at 4.5:1 in the meta grey, never the faint
   decoration grey */
.re-mo-sl{color:var(--re-color-text-meta)}
.re-mo-a{color:var(--re-color-accent-text)}
.re-mo-nt{color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:400}
.re-mo-side{display:flex;flex-direction:column;justify-content:center;gap:var(--re-space-6);padding:var(--re-space-7);
  border-left:var(--re-border-width) solid var(--re-color-line);background:var(--re-color-surface-inset)}
.re-mo-side>div{display:flex;flex-direction:column;gap:var(--re-space-1)}
.re-mo-side b{color:var(--re-color-text);font-size:var(--re-text-xl);font-weight:700;line-height:1.15}
.re-mo-sa b{color:var(--re-color-accent-text)}
.re-mo-side span{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-mo-side .re-words{color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
/* a real zero on this tab is small and in meta, never in the accent (UI
   port QA fix 1, spec 4b item 3): the ledger's, the side panel's, a month's
   acted-on figure and a legend total */
.re-mo-side b.re-zero,.re-mo-sa b.re-zero{color:var(--re-color-text-meta);font-size:var(--re-text-lg);font-weight:600}
.re-mo-a.re-zero,.re-mo-key b.re-zero,.re-mo-key-acted b.re-zero{color:var(--re-color-text-meta);font-weight:400}
@media (max-width:760px){
  .re-months{grid-template-columns:minmax(0,1fr)}
  .re-mo-side{border-left:0;border-top:var(--re-border-width) solid var(--re-color-line)}
}
/* THE PANE'S REDDIT TAB (RELIVE, 2026-09-26: RE Live's tabReddit cards, from
   RE Live.dc.html, scoped to the pane so a client link keeps its page).
   The Reddit card: glass on the card surface, the head, the ledger's three
   cells on hairlines, the waiting line and its bands (an empty band in meta,
   the older band amber and the oldest red, the words always saying which),
   then the rows: the score (green at the act-today band, amber at the med
   band, the text colour under it), the title and "r/<sub>, <age> old", and
   the state at the right, Review in amber with an eye or Cooling in red with
   a clock. The team's actions, the lane pick and the Suggested fit sit
   under the title, and the Waiting, All, New and Replied chips over the
   rows. Month over month: the head, the legend, the chart (Posts found in
   the text colour, Acted on in amber with square points, Still active in
   green and dashed, so no line is told from another by its colour alone),
   the figures under each month and the side panel of totals. */
.re-pane-inner .re-card.re-reddit{margin-bottom:var(--re-space-5);border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-pane-inner .re-reddit .re-card-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) var(--re-space-5);
  padding:18px var(--re-space-7) 0}
.re-pane-inner .re-reddit .re-card-head h2,.re-pane-inner .re-mv .re-mv-head h2{margin:0;color:var(--re-color-text);
  font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em;line-height:inherit}
.re-pane-inner .re-reddit .re-card-sub,.re-pane-inner .re-reddit .re-card-aside{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-pane-inner .re-reddit .re-ledger{grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:var(--re-space-6);border:0;
  background:var(--re-color-line)}
.re-pane-inner .re-reddit .re-ledger-cell{justify-content:flex-end;gap:3px;padding:14px var(--re-space-7);background:var(--re-color-surface)}
.re-pane-inner .re-reddit .re-ledger-value{color:var(--re-color-text);font-size:var(--re-text-300);font-weight:700;letter-spacing:-0.03em;
  line-height:1.1}
.re-pane-inner .re-reddit .re-ledger-value.re-zero{color:var(--re-color-text);font-size:var(--re-text-300);font-weight:700}
.re-pane-inner .re-reddit .re-ledger-still .re-ledger-value{color:var(--re-color-up)}
.re-pane-inner .re-reddit .re-ledger-still .re-ledger-value.re-zero{color:var(--re-color-text-meta)}
.re-pane-inner .re-reddit .re-ledger-value.re-words{color:var(--re-color-text-muted);font-size:var(--re-text-150);font-weight:600;
  letter-spacing:0;line-height:1.1}
.re-pane-inner .re-reddit .re-ledger-label,.re-pane-inner .re-reddit .re-ledger-sub{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
/* the waiting line drawn in v3 (PROMOTE, 2026-10-25): nothing waiting in text-2, else the count in bold and the
   three bands in their inks, each band's words saying which */
.re-pane-inner .re-reddit .re-waitline{align-items:baseline;gap:var(--re-space-2) var(--re-space-5);padding:12px var(--re-space-7);border-bottom:0;
  border-top:var(--re-border-width) solid var(--re-color-line);color:var(--re-color-text)}
.re-pane-inner .re-reddit .re-waitline b{color:var(--re-color-text);font:700 var(--re-text-130) var(--re-font-ui)}
.re-pane-inner .re-reddit .re-wait-none{color:var(--re-color-text-2);font-size:var(--re-text-130);font-weight:400}
.re-pane-inner .re-reddit .re-bands{display:flex;flex-wrap:wrap;gap:var(--re-space-2) var(--re-space-5);font-size:var(--re-text-sm);font-weight:600}
.re-pane-inner .re-reddit .re-band{display:inline;gap:normal;color:var(--re-color-text-meta);font-weight:inherit}
.re-pane-inner .re-reddit .re-band svg.u-i{display:none}
.re-pane-inner .re-reddit .re-band-mid{color:var(--re-color-accent-text)}
.re-pane-inner .re-reddit .re-band-past{color:var(--re-color-down)}
.re-pane-inner .re-reddit .re-band.re-band-zero{color:var(--re-color-text-meta)}
.re-pane-inner .re-reddit .re-thread-bar{padding:var(--re-space-5) var(--re-space-7) 0}
.re-pane-inner .re-reddit #urtable{display:flex;flex-direction:column;padding:var(--re-space-2) var(--re-space-7) var(--re-space-7)}
.re-pane-inner .re-reddit .re-threads>.re-thread{grid-template-columns:34px minmax(0,1fr) 104px;gap:14px;align-items:baseline;
  padding:13px 0;border-top:0;box-shadow:0 -1px 0 var(--re-color-line)}
.re-pane-inner .re-reddit .re-threads>.re-thread:hover{background:var(--re-color-surface-hover)}
/* RE Live's card rows (the bare tab): each row is one link, its words in
   the row's inks, never the link colour; the title over its sub line */
.re-pane-inner .re-reddit .re-threads>a.re-thread{display:grid;color:var(--re-color-text);text-decoration:none}
.re-pane-inner .re-reddit .re-threads>a.re-thread .re-th-t{color:var(--re-color-text);font-size:var(--re-text-135);font-weight:600;
  line-height:1.45;text-wrap:pretty}
.re-pane-inner .re-reddit .re-threads>a.re-thread .re-th-sub{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
/* the Suggested fit under a card row, set in under the title (a public
   thread's row carries it, a standing rule) */
.re-pane-inner .re-reddit .re-th-fit{display:flex;flex-direction:column;gap:var(--re-space-3);padding:0 0 var(--re-space-5) 48px}
.re-pane-inner .re-reddit .re-th-fit>*{margin:0}
.re-pane-inner .re-reddit .re-th-score{color:var(--re-color-text);font-size:var(--re-text-170);font-weight:700;text-align:left}
.re-pane-inner .re-reddit .re-th-hi .re-th-score{color:var(--re-color-up)}
.re-pane-inner .re-reddit .re-th-mid .re-th-score{color:var(--re-color-accent-text)}
.re-pane-inner .re-reddit .re-th-main{display:flex;flex-direction:column;gap:3px;min-width:0}
.re-pane-inner .re-reddit .re-thread-title{color:var(--re-color-text);font-size:var(--re-text-135);font-weight:600;line-height:1.45;
  text-decoration:none;text-wrap:pretty}
.re-pane-inner .re-reddit .re-thread-title:hover{color:var(--re-color-accent-text);text-decoration:none}
.re-pane-inner .re-reddit .re-th-t{display:block}
.re-pane-inner .re-reddit .re-th-meta{margin:0;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-pane-inner .re-reddit .re-th-sub{flex:1 1 100%;min-width:0}
.re-pane-inner .re-reddit .re-th-status{display:contents}
.re-pane-inner .re-reddit .re-th-extra{grid-column:2;display:flex;flex-direction:column;gap:var(--re-space-3);min-width:0}
.re-pane-inner .re-reddit .re-th-extra>*{margin:0}
.re-pane-inner .re-reddit .re-th-status>.u-st{justify-self:start}
.re-pane-inner .re-reddit .re-th-st{display:inline-flex;align-items:center;gap:var(--re-space-3);color:var(--re-color-accent-text);
  font-size:var(--re-text-120);font-weight:650;white-space:nowrap}
.re-pane-inner .re-reddit .re-th-st svg.u-i{width:13px;height:13px}
.re-pane-inner .re-reddit .re-th-cool{color:var(--re-color-down)}
.re-pane-inner .re-reddit .re-seeall{gap:7px;margin:14px 0 0;color:var(--re-color-accent-text);
  font-size:var(--re-text-sm);font-weight:650;text-decoration:none}
.re-pane-inner .re-reddit .re-seeall svg.u-i{width:14px;height:14px;stroke-width:2}
.re-pane-inner .re-reddit .re-quiet{padding:18px var(--re-space-1);color:var(--re-color-text-meta);font-size:var(--re-text-130)}
/* RE Live Client's card drawn in v3 (the bare tab, PROMOTE 2026-10-25): its rows, See all and the quiet line in
   one column 8px apart; each row a re-row holding the link (the score, the title over its sub line, the state)
   and the Suggested fit's place under it; See all and See every thread in text-2 with a small chevron */
.re-pane-inner .re-reddit #urtable[data-re-card]{gap:var(--re-space-4);padding:0 var(--re-space-7) var(--re-space-7)}
.re-pane-inner .re-reddit #urtable[data-re-card] .re-threads{gap:var(--re-space-4)}
.re-pane-inner .re-reddit .re-row.re-rd-row{display:flex;flex-direction:column;border:var(--re-border-width) solid var(--re-color-border);
  background:var(--re-color-surface-row)}
.re-pane-inner .re-reddit .re-rd-row>a.re-rd-link{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:var(--re-space-2) 14px;
  align-items:start;padding:13px 15px 8px;color:inherit;text-decoration:none}
.re-pane-inner .re-reddit .re-rd-row>a.re-rd-link:hover{background:var(--re-color-surface-hover)}
.re-pane-inner .re-reddit .re-rd-row .re-th-score{font-size:var(--re-text-190);line-height:1.1;font-variant-numeric:tabular-nums}
.re-pane-inner .re-reddit .re-rd-row .re-th-main{gap:2px}
.re-pane-inner .re-reddit .re-rd-row .re-th-t{color:var(--re-color-text);font-size:var(--re-text-135);font-weight:600;text-wrap:pretty;
  overflow-wrap:anywhere}
.re-pane-inner .re-reddit .re-rd-row .re-th-t .u-ghost{color:var(--re-color-text-meta)}
.re-pane-inner .re-reddit .re-rd-row .re-th-sub{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-pane-inner .re-reddit .re-rd-row .re-th-st{gap:6px;color:var(--re-color-text-2);font-size:var(--re-text-sm);font-weight:650}
.re-pane-inner .re-reddit .re-rd-row .re-th-st svg.u-i{width:14px;height:14px;stroke-width:2}
.re-pane-inner .re-reddit .re-rd-row .re-th-cool{color:var(--re-color-down)}
.re-pane-inner .re-reddit .re-rd-row>.re-th-fit{display:block;min-width:0;padding:0 15px 12px 73px}
.re-pane-inner .re-reddit .re-rd-row .u-fitbtn{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:2px 0;border-radius:0;
  color:var(--re-color-text-2);font:650 var(--re-text-xs) var(--re-font-ui)}
.re-pane-inner .re-reddit .re-rd-row .u-fitbtn svg.u-i{width:12px;height:12px;stroke-width:2.2}
.re-pane-inner .re-reddit #urtable[data-re-card] .re-seeall{align-self:flex-start;gap:6px;margin:0;color:var(--re-color-text-2);
  font:650 var(--re-text-sm) var(--re-font-ui)}
.re-pane-inner .re-reddit #urtable[data-re-card] .re-seeall svg.u-i{width:12px;height:12px;stroke-width:2.2}
.re-pane-inner .re-reddit #urtable[data-re-card] .re-quiet{margin:14px 0 0;padding:0;color:var(--re-color-text-muted);
  font-size:var(--re-text-sm);line-height:1.5;text-wrap:pretty}
/* RE Live Client's Month over month drawn in v3 (the pane's, PROMOTE 2026-10-25): the head with the month's
   line and its change (a glyph and its words), the legend (each line's sample: Posts found solid in the text
   colour, Acted on in the accent with its square, Still active dashed in green, so no line is told apart by its
   colour alone), the chart over the month columns, and the totals beside it on a hairline */
.re-pane-inner .re-card.re-mv{margin-bottom:var(--re-space-5);padding:var(--re-space-7);border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-mv-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) var(--re-space-5)}
.re-mv-line{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-mv-chg{display:inline-flex;align-items:center;gap:5px;margin-left:auto;font-size:var(--re-text-sm);font-weight:650}
.re-mv-chg svg.u-i{width:13px;height:13px;stroke-width:2}
.re-mv [data-ink="up"]{color:var(--re-color-up)}
.re-mv [data-ink="down"]{color:var(--re-color-down)}
.re-mv [data-ink="meta"]{color:var(--re-color-text-meta)}
.re-mv [data-ink="text"]{color:var(--re-color-text)}
.re-mv [data-ink="accent"]{color:var(--re-color-accent-text)}
.re-mv-legend{display:flex;flex-wrap:wrap;gap:var(--re-space-2) 18px;margin-top:var(--re-space-5);font-size:var(--re-text-sm)}
.re-mv-key{display:inline-flex;align-items:center;gap:7px}
.re-mv-key>svg{width:22px;height:10px;flex:none;overflow:visible}
.re-mv-key line{fill:none;stroke-width:2}
.re-mv-key>svg.re-mv-found line{stroke:var(--re-color-text)}
.re-mv-key>svg.re-mv-acted line{stroke:var(--re-color-accent)}
.re-mv-key>svg.re-mv-acted rect{fill:var(--re-color-accent)}
.re-mv-key>svg.re-mv-active line{stroke:var(--re-color-up);stroke-dasharray:4 3}
.re-mv-key>span{color:var(--re-color-text-2)}
.re-mv-key>b{color:var(--re-color-text);font-weight:700;font-variant-numeric:tabular-nums}
.re-mv-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(150px,210px);gap:18px;margin-top:var(--re-space-5)}
.re-mv-plot{min-width:0}
.re-mv-chart{position:relative;height:150px;border-bottom:var(--re-border-width) solid var(--re-color-line)}
.re-mv-chart>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.re-mv-chart path{fill:none;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round}
.re-mv-chart path.re-mv-found{stroke:var(--re-color-text)}
.re-mv-chart path.re-mv-acted{stroke:var(--re-color-accent)}
.re-mv-chart path.re-mv-active{stroke:var(--re-color-up);stroke-dasharray:5 4;stroke-linecap:butt}
.re-mv-chart>i{position:absolute;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;background:var(--re-color-accent)}
.re-mv-cols{display:grid;gap:4px;margin-top:8px;text-align:center}
.re-mv-cols>span{display:flex;flex-direction:column;gap:2px;min-width:0}
.re-mv-m{color:var(--re-color-text-meta);font-size:var(--re-text-105);letter-spacing:.06em}
.re-mv-v{color:var(--re-color-text-2);font-size:var(--re-text-sm);font-weight:600;font-variant-numeric:tabular-nums}
.re-mv-side{display:flex;flex-direction:column;gap:14px;min-width:0;padding:0 0 0 18px;border-left:var(--re-border-width) solid var(--re-color-line)}
.re-mv-side>span{display:flex;flex-direction:column;gap:2px}
.re-mv-side>span>span:last-child{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-mv-n{font-size:var(--re-text-240);font-weight:700;line-height:1.1;letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.re-mv-n[data-words]{color:var(--re-color-text-muted);font-size:var(--re-text-130);font-weight:600}
.re-mv-none{margin-top:14px;padding:14px 15px;border:var(--re-border-width) dashed var(--re-color-border-control);color:var(--re-color-text-meta);
  font-size:var(--re-text-sm);line-height:1.5}
.re-mv-none b{display:block;color:var(--re-color-text-2);font-weight:650}
@media (max-width:760px){
  .re-pane-inner .re-reddit .re-ledger{grid-template-columns:minmax(0,1fr)}
  .re-pane-inner .re-reddit .re-threads>.re-thread{grid-template-columns:28px minmax(0,1fr)}
  .re-pane-inner .re-reddit .re-th-st{grid-column:2}
  .re-pane-inner .re-reddit .re-rd-row>a.re-rd-link{grid-template-columns:44px minmax(0,1fr)}
  .re-mv-grid{grid-template-columns:minmax(0,1fr)}
  .re-mv-side{padding:14px 0 0;border-left:0;border-top:var(--re-border-width) solid var(--re-color-line)}
}
/* The client column (RE Live's re-client-col, PROMOTE 2026-09-29), the head
   of the detail-mode main column: All clients (page:pane-content's pill),
   the client's status as a shape and its word, the name and the service area
   line, then the To do list and the lanes' list (drawn for the engine's
   operator alone). Each list is a meta caps head on a strong rule, then rows
   on hairlines. A status or
   a lane's state is a shape and a word in one ink, never a colour alone:
   Needs you and Off in the accent text, Stale scan and Dry in the count
   amber, the rest in meta. */
.re-client-col{flex:none;display:flex;flex-direction:column;gap:var(--re-space-6)}
.re-col-id{display:flex;flex-direction:column;gap:var(--re-space-2)}
.re-col-st{display:inline-flex;align-items:center;gap:var(--re-space-3);font-size:var(--re-text-sm);font-weight:600}
.re-col-st .re-mk{width:12px;height:12px;flex:none}
.re-detail .re-col-name{margin:0;color:var(--re-color-text);font-size:var(--re-text-260);font-weight:700;letter-spacing:-0.03em;
  line-height:1.15;text-wrap:pretty;overflow-wrap:anywhere}
.re-col-geo{color:var(--re-color-text-meta);font-size:var(--re-text-120)}
.re-col-todo,.re-col-scan{display:flex;flex-direction:column}
.re-col-head{padding-bottom:var(--re-space-3);border-bottom:var(--re-border-width) solid var(--re-color-border-strong);
  color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.re-col-scan>.re-col-head{display:flex;justify-content:space-between;gap:var(--re-space-4)}
.re-col-scanline{color:var(--re-color-text-meta);letter-spacing:0;text-transform:none}
.re-col-scanline.re-col-bad{color:var(--re-color-accent-count)}
.re-detail .re-col-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:var(--re-space-4);align-items:center;width:100%;
  margin:0;padding:var(--re-space-4) 0;border:0;border-bottom:var(--re-border-width) solid var(--re-color-line);border-radius:0;
  background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.re-detail .re-col-row:hover{background:var(--re-color-surface-hover)}
.re-col-row:focus-visible,.re-switch-row:focus-visible,.re-sw-segbtn:focus-visible{
  outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:calc(-1 * var(--re-focus-width))}
.re-col-n{color:var(--re-color-text);font-size:var(--re-text-190);font-weight:700;letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.re-col-n.re-zero,.re-col-n[data-ink="meta"]{color:var(--re-color-text-meta)}
.re-col-n[data-ink="down"]{color:var(--re-color-down)}
.re-col-what{display:flex;flex-direction:column;min-width:0}
.re-col-t{color:var(--re-color-text-2);font-size:var(--re-text-sm);font-weight:600}
.re-col-note{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-col-clip{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.re-col-row>svg.u-i{width:14px;height:14px;flex:none;stroke-width:2}
.re-col-none{padding:var(--re-space-4) 0;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-col-src{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:var(--re-space-4);align-items:center;
  padding:var(--re-space-3) 0;border-bottom:var(--re-border-width) solid var(--re-color-line)}
.re-col-src>.re-mk{width:12px;height:12px;flex:none}
.re-col-state{font-size:var(--re-text-xs);font-weight:650}
/* RE Live Client's Site health (PROMOTE, 2026-10-21), under To do: the
   score's three groups, each its glyph (a check passing, a warning failing,
   a ring not recorded) and its pages that pass in the same ink, then the
   check-in's last check */
.re-col-site{display:flex;flex-direction:column}
.re-col-sh{display:grid;grid-template-columns:16px minmax(0,1fr);gap:var(--re-space-4);align-items:center;padding:var(--re-space-3) 0;
  border-bottom:var(--re-border-width) solid var(--re-color-line)}
.re-col-shic{display:grid;place-items:center}
.re-col-shic svg.u-i{display:block;width:13px;height:13px;stroke-width:2}
.re-col-shw{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:2px var(--re-space-4);min-width:0}
.re-col-shl{color:var(--re-color-text-2);font-size:var(--re-text-sm);font-weight:600}
.re-col-shv{font-size:var(--re-text-xs);font-weight:650;font-variant-numeric:tabular-nums}
.re-col-site [data-ink="up"]{color:var(--re-color-up)}
.re-col-site [data-ink="down"]{color:var(--re-color-down)}
.re-col-site [data-ink="muted"]{color:var(--re-color-text-muted)}
.re-col-last{padding-top:var(--re-space-3);color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-mk-needs_you,.re-mk-off{color:var(--re-color-accent-text)}
.re-mk-stale_scan,.re-mk-dry{color:var(--re-color-accent-count)}
.re-mk-on_track,.re-mk-quiet,.re-mk-ok,.re-mk-unchecked,.re-mk-none{color:var(--re-color-text-meta)}
/* RE Live v2: the target's states (Off target down, Close in the text, On
   target up, No target in meta) and Site check's (open down, clean and
   queued in meta, not covered in the accent), each a shape and a word */
.re-mk-tg-off,.re-mk-sc-open{color:var(--re-color-down)}
.re-mk-tg-close{color:var(--re-color-text)}
.re-mk-tg-on{color:var(--re-color-up)}
.re-mk-tg-none,.re-mk-sc-clean,.re-mk-sc-queued{color:var(--re-color-text-meta)}
.re-mk-sc-cover{color:var(--re-color-accent-text)}
/* RE Live v2's This period: the four columns at full size under the
   window's words and the target's glyph and word, on the pane's glass */
.re-period{margin-bottom:var(--re-space-5);border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card);overflow:hidden}
.re-period-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) var(--re-space-5);padding:18px var(--re-space-7) 0}
.re-period-head h2{margin:0;font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em}
.re-period-win{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-period-tg{display:inline-flex;align-items:center;gap:var(--re-space-3);margin-left:auto;font-size:var(--re-text-sm);font-weight:650}
.re-period-tg svg.u-i{width:13px;height:13px;flex:none;stroke-width:2}
.re-period-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;margin-top:var(--re-space-6);background:var(--re-color-line)}
.re-period-col{display:flex;flex-direction:column;gap:3px;padding:14px var(--re-space-7);background:var(--re-color-surface)}
.re-period-lab{display:inline-flex;align-items:center;gap:5px;color:var(--re-color-text-meta);font-size:var(--re-text-105);letter-spacing:.06em;text-transform:uppercase}
.re-period-lab i{flex:0 0 auto;width:6px;height:6px}
.re-period-val{display:inline-flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-3)}
.re-period-n{font-size:var(--re-text-300);line-height:1;font-weight:700;letter-spacing:-0.03em;font-variant-numeric:tabular-nums}
.re-period-n[data-word]{font-size:var(--re-text-150)}
.re-period-w{font-size:var(--re-text-120);font-weight:650}
.re-period-note{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-period [data-ink="up"]{color:var(--re-color-up)}
.re-period [data-ink="down"]{color:var(--re-color-down)}
.re-period [data-ink="accent"]{color:var(--re-color-accent-text)}
.re-period [data-ink="text"]{color:var(--re-color-text)}
.re-period [data-ink="meta"]{color:var(--re-color-text-meta)}
.re-period [data-ink="muted"]{color:var(--re-color-text-muted)}
.re-period i[data-sw="content"]{background:var(--re-color-channel-content)}
.re-period i[data-sw="outreach"]{background:var(--re-color-channel-outreach)}
.re-period i[data-sw="published"]{background:var(--re-color-channel-published)}
.re-period i[data-sw="down"]{background:var(--re-color-down)}
.re-period i[data-sw="accent"]{background:var(--re-color-accent-text)}
.re-period i[data-sw="muted"]{background:var(--re-color-text-muted)}
.re-period i[data-sw="line"]{background:var(--re-color-line)}
/* Switch client (RE Live's re-switch): under a strong rule, bleeding to the
   column's sides and foot, it fills what the client column leaves and
   scrolls its rows on its own. The head (Switch client, to review), the
   category switcher (RE Live's glide: the picked category's gold is the
   group's one highlight, the faces' opacity the shell's glide rule), then one
   row per client: the open one pressed on the raised fill, its name bold in
   the text colour, the count untouched at the high band amber while there is
   one. */
.re-detail .re-switch{flex:1 1 auto;min-height:320px;display:flex;flex-direction:column;gap:var(--re-space-4);
  margin:var(--re-space-6) -22px calc(-1 * var(--re-space-9));padding-top:var(--re-space-4);
  border-top:var(--re-border-width) solid var(--re-color-border-strong)}
.re-sw-head{display:flex;justify-content:space-between;gap:var(--re-space-4);padding:0 22px;color:var(--re-color-text-meta);
  font-size:var(--re-text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.re-sw-seg{position:relative;display:flex;flex-wrap:wrap;gap:var(--re-space-1);margin:0 22px;padding:var(--re-space-1);
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice)}
.re-sw-seg>[data-ind]{position:absolute;left:0;top:0;width:0;height:0;border-radius:var(--re-radius-choice-sm);
  background:var(--re-color-accent);transform-origin:0 0;pointer-events:none}
.re-detail .re-sw-segbtn{position:relative;display:grid;flex:1 1 auto;margin:0;padding:var(--re-space-3) var(--re-space-4);border:0;
  border-radius:var(--re-radius-choice-sm);background:none;color:revert;font:600 var(--re-text-sm) var(--re-font-ui);white-space:nowrap;cursor:pointer}
.re-sw-segbtn>[data-off]{grid-area:1/1;color:var(--re-color-text-muted)}
.re-sw-segbtn>[data-off]:hover{color:var(--re-color-text)}
.re-sw-segbtn>[data-on]{grid-area:1/1;color:var(--re-color-on-accent);font-weight:650}
.re-sw-rows{flex:1 1 auto;min-height:0;overflow-y:auto;display:flex;flex-direction:column;
  padding:0 var(--re-space-5) var(--re-space-5)}
/* a row is a link to its client (PROMOTE, 2026-10-21), the open one aria-current */
.re-detail .re-switch-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--re-space-4);align-items:center;width:100%;
  margin:0;padding:var(--re-space-4);border:0;border-radius:var(--re-radius-choice-sm);background:transparent;color:inherit;
  font:inherit;text-align:left;text-decoration:none;cursor:pointer}
.re-detail .re-switch-row[aria-current="page"]{background:var(--re-color-surface-raised)}
.re-detail .re-switch-row:hover{background:var(--re-color-surface-hover)}
.re-sw-id{display:flex;flex-direction:column;gap:2px;min-width:0}
.re-sw-name{color:var(--re-color-text-2);font-size:var(--re-text-140);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.re-switch-row[aria-current="page"] .re-sw-name{color:var(--re-color-text);font-weight:700}
.re-sw-st{display:inline-flex;align-items:center;gap:var(--re-space-2);font-size:var(--re-text-xs);font-weight:600}
.re-sw-st .re-mk{width:9px;height:9px;flex:none}
.re-sw-rev{color:var(--re-color-accent-text);font-size:var(--re-text-190);font-weight:700;letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.re-sw-rev.re-zero{color:var(--re-color-text-meta)}
.re-detail .re-sw-rev.re-words{color:var(--re-color-text-muted);font-size:var(--re-text-xs);font-weight:600;letter-spacing:0}
.re-sw-empty{margin:0;padding:var(--re-space-5) var(--re-space-4);color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
/* RE Live Client 4a (the 10-30 promote): the column's home-style card (the items ready and the
   temperature, the name, segment, strategist and area, the Gate 1 line), the monthly target and the full
   site health, then the monthly report's link; and the pane's four cards (Health, Content, Outreach,
   Findings) in the tab strip's place, the open one on the accent tint with the accent's underline. A
   figure, a state or an edge is always beside its word, never a colour alone. */
.re-col-cap{color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.re-cc{flex:none;display:grid;grid-template-columns:6px minmax(0,1fr);overflow:hidden;background:var(--re-sheen),var(--re-color-surface);
  border-radius:var(--re-radius-container);border:var(--re-border-width) solid var(--re-color-border);box-shadow:var(--re-shadow-card)}
.re-cc-edge{background:var(--re-color-text-muted)}
.re-cc[data-temp="good"] .re-cc-edge{background:var(--re-color-up)}
.re-cc[data-temp="lukewarm"] .re-cc-edge{background:var(--re-color-accent)}
.re-cc[data-temp="none"] .re-cc-edge{background:var(--re-color-down)}
.re-cc-body{display:flex;flex-direction:column;gap:12px;min-width:0;padding:18px 18px 18px 16px}
.re-cc-top{display:flex;align-items:center;gap:14px}
.re-cc-n{color:var(--re-color-text-meta);font-size:var(--re-text-2xl);font-weight:700;letter-spacing:-0.04em;line-height:.86;font-variant-numeric:tabular-nums}
.re-cc-n[data-word]{font-size:var(--re-text-200)}
/* the 10-31 promote: the card leads with Search visibility, so the number and the temperature's word take the
   search read's ink and the temperature is the edge and a glyph beside its word */
.re-cc-n[data-ink="text"],.re-cc-temp[data-ink="text"]{color:var(--re-color-text)}
.re-cc-n[data-ink="meta"],.re-cc-temp[data-ink="meta"]{color:var(--re-color-text-meta)}
.re-cc-n[data-ink="muted"],.re-cc-temp[data-ink="muted"]{color:var(--re-color-text-muted)}
.re-cc-note{color:var(--re-color-text-meta);font-size:var(--re-text-110);line-height:1.35}

.re-cc-unit{display:flex;flex-direction:column;gap:4px}
.re-cc-u{color:var(--re-color-text-muted);font-size:var(--re-text-105);letter-spacing:.08em;text-transform:uppercase}
.re-cc-temp{display:inline-flex;align-items:center;gap:6px;font:700 var(--re-text-110) var(--re-font-ui);letter-spacing:.06em;text-transform:uppercase}

.re-cc-id{display:flex;flex-direction:column;gap:4px;min-width:0}
.re-detail .re-cc-name{margin:0;color:var(--re-color-text);font-size:var(--re-text-260);font-weight:700;letter-spacing:-0.03em;line-height:1.15;text-wrap:pretty}
.re-cc-meta,.re-tgb-why,.re-sh-meta{color:var(--re-color-text-meta);font-size:var(--re-text-120)}
.re-tgb{flex:none;display:flex;flex-direction:column;gap:8px;padding:16px;background:var(--re-sheen),var(--re-color-surface);
  border-radius:var(--re-radius-container);border:var(--re-border-width) solid var(--re-color-border)}
.re-tgb.re-tgb-off{border-color:var(--re-color-down-border)}
.re-tgb-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.re-tgb-big{display:inline-flex;align-items:baseline;gap:6px}
.re-tgb-big b{font-size:var(--re-text-450);line-height:.9;letter-spacing:-0.03em;font-variant-numeric:tabular-nums}
.re-tgb-big span{color:var(--re-color-text-2);font-size:var(--re-text-130)}
.re-tgb-st{display:inline-flex;align-items:center;gap:6px;font-size:var(--re-text-180);font-weight:700;letter-spacing:-0.015em}
.re-tgb-st>span{color:var(--re-color-text)}
.re-tgb-st svg.u-i{display:block;width:16px;height:16px;stroke-width:2}
.re-tgb-bar,.re-sh-bar{display:flex;height:6px;background:var(--re-color-line)}
.re-sh-bar{height:5px}
.re-sh{flex:none;display:flex;flex-direction:column;gap:16px;padding:16px;background:var(--re-sheen),var(--re-color-surface);
  border-radius:var(--re-radius-container);border:var(--re-border-width) solid var(--re-color-border);box-shadow:var(--re-shadow-card)}
.re-sh-head{display:flex;flex-direction:column;gap:3px}
.re-sh-top{display:flex;align-items:center;gap:10px}
.re-sh-top>.re-col-cap{flex:1}
.re-sh-st{display:inline-flex;align-items:center;gap:6px;font-size:var(--re-text-150);font-weight:700}
.re-sh svg.u-i{display:block;width:14px;height:14px;stroke-width:2}
.re-sh-issues{display:flex;flex-direction:column;gap:8px}
.re-sh-ihead{display:flex;align-items:baseline;gap:8px}
.re-sh-ihead b,.re-sh-checks>b,.re-sh-src>b{font-size:var(--re-text-150)}
.re-sh-ihead b{flex:1}
.re-sh-ihead span{font-size:var(--re-text-120);font-weight:650}
.re-sh-issue{display:flex;flex-direction:column;gap:3px;padding:10px 12px;border:var(--re-border-width) solid var(--re-color-down-border);
  border-radius:var(--re-radius-choice);background:var(--re-color-down-tint)}
.re-sh-ih{display:flex;align-items:center;gap:8px;color:var(--re-color-down)}
.re-sh-ih b{flex:1;min-width:0;color:var(--re-color-text);font-weight:650}
.re-sh-pri{padding:1px 8px;border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-pill);
  font-size:var(--re-text-105);font-weight:650;white-space:nowrap}
.re-sh-reason{color:var(--re-color-text-2);font-size:var(--re-text-120);line-height:1.45;overflow-wrap:anywhere}
.re-client-col a.re-sh-link{align-self:flex-start;display:inline-flex;align-items:center;gap:4px;min-height:30px;color:var(--re-color-accent-text);
  font-size:var(--re-text-120);font-weight:650}
.re-sh-link svg.u-i{width:12px;height:12px;stroke-width:2.2}
.re-sh-none{display:inline-flex;align-items:center;gap:8px;color:var(--re-color-text-2);font-size:var(--re-text-130)}
.re-sh-none>span{display:inline-flex}
.re-sh-checks{display:flex;flex-direction:column}
.re-sh-checks>b{margin-bottom:4px}
.re-sh-check{display:flex;flex-direction:column;gap:5px;padding:10px 0;border-top:var(--re-border-width) solid var(--re-color-line)}
.re-sh-ch{display:flex;align-items:center;gap:8px}
.re-sh-ch>span:first-child{display:inline-flex}
.re-sh-check svg.u-i{width:13px;height:13px}
.re-sh-cl{flex:1;min-width:0;color:var(--re-color-text-2);font-size:var(--re-text-sm);font-weight:600}
.re-sh-cv{font-size:var(--re-text-xs);font-weight:650;font-variant-numeric:tabular-nums;white-space:nowrap}
.re-sh-cw,.re-sh-scan{color:var(--re-color-text-meta);font-size:var(--re-text-110);line-height:1.45;text-wrap:pretty}
.re-sh-src{display:flex;flex-direction:column;gap:8px;padding-top:12px;border-top:var(--re-border-width) solid var(--re-color-line)}
.re-sh-chips{display:flex;flex-wrap:wrap;gap:6px}
.re-sh-chip{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 10px;border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-pill);color:var(--re-color-text-2);font-size:var(--re-text-120);font-weight:650;white-space:nowrap}
.re-sh-chip i{width:6px;height:6px;background:var(--re-color-channel-content)}
.re-sh-nosrc{color:var(--re-color-text-muted);font-size:var(--re-text-120)}
/* the older sheet's .u-view a gives a link its parent's colour: a class, the element and the column win the accent back */
.re-client-col a.re-col-rep{display:inline-flex;align-items:center;gap:6px;align-self:flex-start;min-height:36px;color:var(--re-color-accent-text);
  font-size:var(--re-text-140);font-weight:650}
.re-col-sw{display:flex;align-items:center;gap:var(--re-space-4);margin:0}
.re-col-sw>.re-col-cap{flex:none}
.re-col-sw .re-input{flex:1;min-width:0;min-height:44px;margin:0;padding:5px 9px;border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-choice-sm);background:var(--re-color-surface-raised);color:var(--re-color-text);font:600 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-col-sw .re-input:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
.re-col-rep svg.u-i{display:block;width:13px;height:13px;stroke-width:2}
.re-client-col [data-ink="up"]{color:var(--re-color-up)}
.re-client-col [data-ink="down"]{color:var(--re-color-down)}
.re-client-col [data-ink="accent"]{color:var(--re-color-accent-text)}
.re-client-col [data-ink="text"]{color:var(--re-color-text)}
.re-client-col [data-ink="text2"]{color:var(--re-color-text-2)}
.re-client-col [data-ink="meta"]{color:var(--re-color-text-meta)}
.re-client-col [data-ink="muted"]{color:var(--re-color-text-muted)}
.re-client-col i[data-ink="up"]{background:var(--re-color-up)}
.re-client-col i[data-ink="down"]{background:var(--re-color-down)}
.re-client-col i[data-ink="text"]{background:var(--re-color-text)}
.re-client-col i[data-ink="meta"]{background:var(--re-color-text-meta)}
.re-client-col i[data-ink="muted"]{background:var(--re-color-text-muted)}
.re-lcs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:12px;align-items:stretch;margin-bottom:18px}
.re-lc{display:grid;grid-template-columns:6px minmax(0,1fr);min-width:0;min-height:44px;overflow:hidden;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);
  background:var(--re-sheen),var(--re-color-surface);box-shadow:var(--re-shadow-card);color:var(--re-color-text);text-decoration:none}
.re-lc:hover{border-color:var(--re-color-border-accent)}
.re-lc[aria-current="true"]{border-color:var(--re-color-border-accent);background:var(--re-color-accent-tint);
  box-shadow:inset 0 -3px 0 var(--re-color-accent),var(--re-shadow-card)}
.re-lc-edge{background:var(--re-color-text-muted)}
.re-lc[data-edge="down"] .re-lc-edge{background:var(--re-color-down)}
.re-lc[data-edge="accent"] .re-lc-edge{background:var(--re-color-accent-text)}
.re-lc[data-edge="up"] .re-lc-edge{background:var(--re-color-up)}
.re-lc[data-edge="content"] .re-lc-edge{background:var(--re-color-channel-content)}
.re-lc[data-edge="outreach"] .re-lc-edge{background:var(--re-color-channel-outreach)}
.re-lc[data-edge="faint"] .re-lc-edge{background:var(--re-color-text-faint)}
.re-lc-body{display:flex;flex-direction:column;gap:8px;min-width:0;padding:14px 16px 16px 14px}
.re-lc-top{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px}
.re-lc-label{flex:1 1 auto;color:var(--re-color-text-2);font-size:var(--re-text-105);font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.re-lc-st{display:inline-flex;align-items:center;gap:3px;color:var(--re-color-text-meta);font-size:var(--re-text-110);font-weight:650}
.re-lc[aria-current="true"] .re-lc-st{color:var(--re-color-accent-text)}
.re-lc-st svg.u-i{display:block;width:13px;height:13px;stroke-width:2}
.re-lc-fig{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
.re-lc-n{color:var(--re-color-text);font-size:var(--re-text-450);font-weight:700;letter-spacing:-0.03em;line-height:1;font-variant-numeric:tabular-nums}
.re-lc-n[data-word]{font-size:var(--re-text-240)}
.re-lc-n[data-ink="down"]{color:var(--re-color-down)}
.re-lc-n[data-ink="accent"]{color:var(--re-color-accent-text)}
.re-lc-n[data-ink="meta"]{color:var(--re-color-text-meta)}
.re-lc-n[data-ink="muted"]{color:var(--re-color-text-muted)}
.re-lc-n[data-zero]{font-size:var(--re-text-200)}
.re-lc[data-edge="text2"] .re-lc-edge{background:var(--re-color-text-2)}
.re-lc-line{flex:1 1 90px;min-width:0;color:var(--re-color-text-2);font-size:var(--re-text-130);font-weight:600;line-height:1.3;
  text-wrap:pretty;overflow-wrap:anywhere}
@media (max-width:979.98px){.re-lcs{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* RE Live Client (the 10-31 promote): the header strip (where the client stands, what is stopping them, what
   we are shipping, what moved), the Analyze panel with the latest monthly report, and the ladder cards' own
   blocks: Search visibility with Top queries and pages and Close to page one, Site readiness, Answer coverage,
   Roundup and best-of pages, News for briefs and the buyer questions found. Every state is a glyph or a word
   beside its colour, never a colour alone */
.re-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:12px;margin-bottom:12px}
.re-strip-x{display:flex;flex-direction:column;gap:5px;min-width:0;padding:14px 16px;border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);backdrop-filter:var(--re-glass-blur);
  -webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-strip-l{color:var(--re-color-text-2);font-size:var(--re-text-105);font-weight:650;letter-spacing:.08em;text-transform:uppercase}
.re-strip-v{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px}
.re-strip-n{display:inline-flex;align-items:center;gap:6px;align-self:center;font-size:var(--re-text-170);line-height:1.1;font-weight:700;
  letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.re-strip-n[data-fs="big"]{font-size:var(--re-text-260)}
.re-strip-n svg.u-i{display:block;width:18px;height:18px;stroke-width:2.2}
.re-strip-ln{flex:1 1 100px;min-width:0;color:var(--re-color-text-2);font-size:var(--re-text-130);font-weight:600;line-height:1.3;text-wrap:pretty}
.re-strip-note{color:var(--re-color-text-meta);font-size:var(--re-text-120);line-height:1.4;text-wrap:pretty}
/* the inks these blocks name, scoped to them (the older pane rules keep their own) */
:is(.re-strip,.re-az,.re-sv) [data-ink="text"]{color:var(--re-color-text)}
:is(.re-strip,.re-az,.re-sv) [data-ink="text2"]{color:var(--re-color-text-2)}
:is(.re-strip,.re-az,.re-sv) [data-ink="meta"]{color:var(--re-color-text-meta)}
:is(.re-strip,.re-az,.re-sv) [data-ink="muted"]{color:var(--re-color-text-muted)}
:is(.re-strip,.re-az,.re-sv) [data-ink="up"]{color:var(--re-color-up)}
:is(.re-strip,.re-az,.re-sv) [data-ink="down"]{color:var(--re-color-down)}
:is(.re-strip,.re-az,.re-sv) [data-ink="accent"]{color:var(--re-color-accent-text)}
:is(.re-strip,.re-az,.re-sv) [data-ink="content"]{color:var(--re-color-channel-content)}
.re-az{display:flex;flex-direction:column;gap:14px;margin-bottom:12px;padding:16px;border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);backdrop-filter:var(--re-glass-blur);
  -webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-az-top{display:flex;flex-wrap:wrap;align-items:flex-start;gap:14px 28px}
.re-az-main{display:flex;flex-direction:column;align-items:flex-start;gap:8px;flex:1 1 320px;min-width:0}
.re-az-btns{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;width:100%}
#pane .re-btn.re-az-go,#pane .re-btn.re-az-again{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;margin:0;
  padding:var(--re-space-3) 20px;border-radius:var(--re-radius-toggle);font:700 var(--re-text-150) var(--re-font-ui);cursor:pointer;white-space:nowrap}
#pane .re-btn.re-az-go,#view .re-btn.re-az-go{border:0;background:var(--re-color-accent);color:var(--re-color-on-accent)}
#pane .re-btn.re-az-go:active:not(:disabled),#view .re-btn.re-az-go:active:not(:disabled){background-color:var(--re-color-accent-press)}
#pane .re-btn.re-az-again,#view .re-btn.re-az-again{border:var(--re-border-width) solid var(--re-color-border-control);background:var(--re-color-surface-raised);
  color:var(--re-color-text-2);font-weight:650}
#pane .re-btn.re-az-again:hover,#view .re-btn.re-az-again:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
#pane .re-az .re-mcp-mark{width:18px;height:18px}
.re-mcp-mark.re-az-on g{fill:var(--re-color-on-accent)}
.re-az-note{display:inline-flex;align-items:center;gap:6px;min-width:0;font-size:var(--re-text-xs);font-weight:650;text-wrap:pretty}
.re-az-note svg.u-i{display:block;flex:none;width:13px;height:13px;stroke-width:2}
.re-az-when{color:var(--re-color-text-meta);font-weight:500}
.re-az-see{padding:2px 0;border:0;background:none;color:var(--re-color-text-2);font:650 var(--re-text-xs) var(--re-font-ui);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.re-az-conn{color:var(--re-color-text-meta);font-size:var(--re-text-120);line-height:1.45;text-wrap:pretty}
.re-az-rep{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px;min-height:44px;margin-left:auto}
#pane a.re-az-replink{display:inline-flex;align-items:center;gap:6px;min-height:36px;color:var(--re-color-accent-text);font-size:var(--re-text-140);font-weight:650}
.re-az-replink svg.u-i,.re-az-copylink svg.u-i,.re-az-copy svg.u-i{display:block;width:13px;height:13px;stroke-width:2}
.re-az-copylink{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0;border:0;background:none;color:var(--re-color-text-2);
  font:650 var(--re-text-xs) var(--re-font-ui);cursor:pointer}
.re-az-copylink:hover{color:var(--re-color-text)}
.re-az-none{color:var(--re-color-text-muted);font-size:var(--re-text-130)}
.re-az-panel{display:flex;flex-direction:column;gap:10px;min-width:0;padding-top:12px;border-top:var(--re-border-width) solid var(--re-color-border)}
.re-az-panel pre{margin:0;max-height:calc(12 * 1.5em);overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;padding:10px 12px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-toggle);background:var(--re-color-surface);
  color:var(--re-color-text);font:500 var(--re-text-sm)/1.5 ui-monospace,Menlo,Consolas,monospace}
.re-az-pbtns{display:flex;gap:7px}
#pane .re-btn.re-az-copy{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:32px;margin:0;padding:var(--re-space-3) 13px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-toggle);background:var(--re-color-surface-raised);
  color:var(--re-color-text-2);font:650 var(--re-text-sm) var(--re-font-ui);cursor:pointer;white-space:normal;text-align:left}
#pane .re-btn.re-az-copy:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
.re-az-see:focus-visible,.re-az-copylink:focus-visible,.re-btn.re-az-go:focus-visible,.re-btn.re-az-again:focus-visible,.re-btn.re-az-copy:focus-visible,
.re-btn.re-sv-act:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
#pane .re-card.re-sv{margin-bottom:var(--re-space-5);padding:var(--re-space-7);border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);backdrop-filter:var(--re-glass-blur);
  -webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-sv-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) 14px}
#pane .re-sv-head h2{margin:0;font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em}
.re-sv-sub{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-sv-cells,.re-qs-cells{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:var(--re-space-5) var(--re-space-7);margin-top:var(--re-space-5)}
.re-sv-cell,.re-qs-cell{display:flex;flex-direction:column;gap:4px;min-width:0}
.re-qs-cell{gap:3px}
.re-sv-lab{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:600;
  letter-spacing:.12em;text-transform:uppercase}
.re-sv-n{font-size:var(--re-text-450);line-height:1.05;font-weight:700;letter-spacing:-0.03em;font-variant-numeric:tabular-nums}
.re-sv-n[data-fs="200"]{font-size:var(--re-text-200)}
.re-sv-n[data-fs="170"]{font-size:var(--re-text-170)}
.re-sv-mv{display:inline-flex;align-items:center;gap:6px;font-size:var(--re-text-130);font-weight:650;line-height:1.35;text-wrap:pretty}
.re-sv-mv svg.u-i,.re-sr-n svg.u-i,.re-sr-part svg.u-i,.re-sv-done svg.u-i{display:block;flex:none;width:13px;height:13px;stroke-width:2.2}
.re-sr-part svg.u-i{stroke-width:2}
.re-sr-n svg.u-i{width:16px;height:16px;stroke-width:2}
.re-sv-none{margin-top:var(--re-space-4);padding:14px 15px;border:var(--re-border-width) dashed var(--re-color-border-control);
  color:var(--re-color-text-muted);font-size:var(--re-text-sm);line-height:1.5;text-wrap:pretty}
.re-sv-list .re-sv-none{margin-top:0}
/* AI visibility (RE Live, 2026-11-04): the label, the figure or its words, and the note under them */
.re-sv-ai{display:flex;flex-direction:column;gap:3px;margin:var(--re-space-6) 0 0;padding-top:var(--re-space-4);
  border-top:var(--re-border-width) solid var(--re-color-line)}
.re-sv-aih{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
.re-sv-aih b{color:var(--re-color-text-muted);font-size:var(--re-text-150);font-weight:700;font-variant-numeric:tabular-nums}
.re-sv-ain{color:var(--re-color-text-meta);font-size:var(--re-text-120);line-height:1.45;text-wrap:pretty}
/* the shell's 90ch cap for long text rows is not RE Live Client's for these lines: they run the card's width */
#pane .re-sv-ai{max-width:none}
.re-sv-lists{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:var(--re-space-5) var(--re-space-7);margin-top:var(--re-space-5)}
.re-sv-list{display:flex;flex-direction:column;min-width:0}
.re-sv-list>b{margin-bottom:4px;font-size:var(--re-text-150)}
.re-sv-row{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 14px;padding:10px 0;
  border-top:var(--re-border-width) solid var(--re-color-line)}
.re-sv-rn{min-width:0;font-size:var(--re-text-135);font-weight:650;overflow-wrap:anywhere}
.re-sv-rl{color:var(--re-color-text-2);font-size:var(--re-text-sm);font-variant-numeric:tabular-nums}
#pane .re-row.re-sv-near{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(200px,1fr);gap:10px var(--re-space-6);align-items:start;
  margin-top:var(--re-space-4);padding:13px 15px;border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface-row)}
.re-sv-nq{display:flex;flex-direction:column;gap:3px;min-width:0}
.re-sv-nq b{font:650 var(--re-text-135) var(--re-font-ui);overflow-wrap:anywhere}
.re-sv-nq span{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-sv-nact{display:flex;flex-direction:column;align-items:flex-end;gap:7px;min-width:0;max-width:300px}
#pane .re-btn.re-sv-act{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:32px;margin:0;padding:var(--re-space-3) 14px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-toggle);background:var(--re-color-surface-raised);
  color:var(--re-color-text);font:700 var(--re-text-sm) var(--re-font-ui);cursor:pointer;white-space:nowrap}
#pane .re-btn.re-sv-act:hover{border-color:var(--re-color-border-strong)}
.re-sv-done{display:inline-flex;align-items:center;gap:6px;color:var(--re-color-text-2);font-size:var(--re-text-xs);font-weight:650}
.re-sv-proof,.re-ci-proof{color:var(--re-color-text-meta);font-size:var(--re-text-xs);line-height:1.45;text-wrap:pretty}
.re-ci-proof{max-width:260px}
.re-sr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:var(--re-space-6) var(--re-space-7);margin-top:var(--re-space-5)}
.re-sr-cell{display:flex;flex-direction:column;gap:6px;min-width:0}
.re-sr-lab{color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.re-sr-score{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px}
.re-sr-score b{font-size:var(--re-text-200);line-height:1.05;font-weight:700;letter-spacing:-0.02em;font-variant-numeric:tabular-nums}
.re-sr-line{color:var(--re-color-text-meta);font-size:var(--re-text-120);line-height:1.45;text-wrap:pretty}
.re-sr-part{display:flex;align-items:center;gap:7px;font-size:var(--re-text-sm)}
.re-sr-part>span:first-child{display:inline-flex}
.re-sr-pl{flex:1;min-width:0;color:var(--re-color-text-2)}
.re-sr-pw{font-weight:650}
.re-sr-n{display:inline-flex;align-items:center;gap:7px;font-size:var(--re-text-170);line-height:1.15;font-weight:700;font-variant-numeric:tabular-nums}
.re-sr-n[data-fs="240"]{font-size:var(--re-text-240)}
.re-cov-total{margin-left:auto;color:var(--re-color-text-meta);font-size:var(--re-text-130)}
.re-cov-bar{display:flex;height:10px;margin-top:var(--re-space-5);overflow:hidden;border-radius:var(--re-radius-pill);background:var(--re-color-line)}
.re-cov-bar i{display:block;flex:0 0 auto}
.re-cov-bar i[data-ink="up"]{background:var(--re-color-up)}
.re-cov-bar i[data-ink="content"]{background:var(--re-color-channel-content)}
.re-cov-bar i[data-ink="down"]{background:var(--re-color-down)}
.re-cov-bar i[data-ink="faint"]{background:var(--re-color-text-faint)}
.re-cov-segs{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,140px),1fr));gap:var(--re-space-5);margin-top:var(--re-space-5)}
.re-cov-seg{display:flex;flex-direction:column;gap:3px;min-width:0}
.re-cov-sl{display:inline-flex;align-items:center;gap:6px;color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:600;letter-spacing:.06em;text-transform:uppercase}
.re-cov-sl .re-gl{width:9px;height:9px}
.re-cov-seg b,.re-qs-cell b{font-size:var(--re-text-150);font-weight:700;font-variant-numeric:tabular-nums}
.re-cov-seg b[data-fs="240"],.re-qs-cell b[data-fs="240"]{font-size:var(--re-text-240)}
.re-cov-note{margin:var(--re-space-4) 0 0;color:var(--re-color-text-meta);font-size:var(--re-text-xs);line-height:1.5}
.re-cov-np{display:flex;flex-direction:column;gap:4px;margin-top:var(--re-space-6);padding-top:var(--re-space-5);border-top:var(--re-border-width) solid var(--re-color-line)}
.re-cov-np b{font-size:var(--re-text-150)}
.re-cov-np span{color:var(--re-color-text-muted);font-size:var(--re-text-sm);line-height:1.5;text-wrap:pretty}
.re-qs-n{margin-left:auto;font-size:var(--re-text-200);font-weight:700;font-variant-numeric:tabular-nums}
.re-qs-src{margin-top:var(--re-space-6)}
/* By source (RE Live, 2026-11-04): each source's name over its kind, owned or open */
.re-sv-rs{display:flex;flex-direction:column;gap:2px;min-width:0}
.re-sv-rsub{color:var(--re-color-text-meta);font-size:var(--re-text-xs);line-height:1.45;text-wrap:pretty}
/* the ladder's Content topics card (RE Live, 2026-11-04): its figure a pill, the accent while topics wait */
.re-lc-chip{display:inline-flex;align-items:center;min-height:26px;padding:0 10px;border-radius:var(--re-radius-pill);
  border:var(--re-border-width) solid var(--re-color-border-control);color:var(--re-color-text-muted);font:700 var(--re-text-130) var(--re-font-ui);
  font-variant-numeric:tabular-nums;white-space:nowrap}
.re-lc-chip[data-ink="accent"]{border-color:var(--re-color-accent);color:var(--re-color-accent-text)}
/* Connections in the client column (RE Live, 2026-11-04): a card that folds open and shut, its count or its words */
.re-conn{flex:none;display:flex;flex-direction:column;gap:12px;padding:16px;background:var(--re-sheen),var(--re-color-surface);
  border-radius:var(--re-radius-container);border:var(--re-border-width) solid var(--re-color-border);box-shadow:var(--re-shadow-card)}
.re-conn-hd{display:flex;align-items:center;gap:10px;width:100%;min-height:32px;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.re-conn-t{display:flex;flex-direction:column;gap:3px;flex:1;min-width:0}
.re-conn-n{color:var(--re-color-text-muted);font-size:var(--re-text-150);font-weight:700;font-variant-numeric:tabular-nums}
.re-conn-chev{display:inline-flex;color:var(--re-color-text-meta)}
.re-conn-chev svg.u-i{width:14px;height:14px;stroke-width:2}
.re-conn-hd[aria-expanded="true"] .re-conn-chev{transform:rotate(90deg)}
.re-conn-list{display:flex;flex-direction:column;gap:12px}
.re-conn-list[hidden]{display:none}
.re-conn-none{color:var(--re-color-text-muted);font-size:var(--re-text-120)}
/* the rows, grouped under their rung: glyph, source, state word, the read or the ask, Copy ask */
.re-conn-grp{display:flex;flex-direction:column;gap:6px}
.re-conn-rung{color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.re-conn-row{display:grid;grid-template-columns:16px minmax(0,1fr) auto;align-items:start;gap:4px 8px}
.re-conn-g{display:inline-flex;padding-top:2px;color:var(--re-color-text)}
.re-conn-g svg.u-i{width:14px;height:14px;stroke-width:2}
.re-conn-main{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;min-width:0}
.re-conn-nm{color:var(--re-color-text);font-size:var(--re-text-130);font-weight:650}
.re-conn-st{color:var(--re-color-text-2);font-size:var(--re-text-120)}
.re-conn-sub{flex-basis:100%;color:var(--re-color-text-muted);font-size:var(--re-text-120);overflow-wrap:anywhere}
.re-conn-na .re-conn-g,.re-conn-na .re-conn-nm,.re-conn-na .re-conn-st{color:var(--re-color-text-muted)}
.re-conn-warn .re-conn-g,.re-conn-warn .re-conn-st{color:var(--re-color-accent-text)}
.re-conn-copy{min-height:28px;padding:0 10px;border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice-sm);
  background:var(--re-color-surface-raised);color:var(--re-color-text-2);font:650 var(--re-text-120) var(--re-font-ui);cursor:pointer;white-space:nowrap}
.re-conn-copy:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
@media (max-width:760px){.re-conn-copy{min-height:44px}}
@media (max-width:760px){.re-conn-hd{min-height:44px}}
@media (max-width:979.98px){
  #pane .re-row.re-sv-near{grid-template-columns:minmax(0,1fr)}
  .re-sv-nact{align-items:stretch;max-width:none}
  #pane .re-btn.re-sv-act{width:100%;min-height:44px}
}
@media (max-width:760px){
  .re-az-main{flex:1 1 100%}
  .re-az-btns{flex-direction:column;align-items:stretch}
  #pane .re-btn.re-az-go,#pane .re-btn.re-az-again{width:100%;min-height:48px}
  .re-az-rep{min-height:48px;margin-left:0}
  .re-az-pbtns{flex-direction:column}
  #pane .re-btn.re-az-copy{min-height:44px}
}
/* page:pane-reddit end */

/* page:pane-published start */
/* The client page's Published tab (RE Live Client, PROMOTE 2026-10-21), and
   the parts the Health tab's cards share with it: a glass card, its title
   and note, then one row per page on the row fill, its path and title, its
   days, the five QA marks (a check passing, a cross failing, each with its
   word), the failing marks' words, the match, a done line in the accent,
   and at the row's end the accent's Confirm and the outlined secondary */
#pane .re-card.re-hp{margin-bottom:var(--re-space-5);padding:var(--re-space-7);border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
#pane .re-hp h2{margin:0;font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em}
.re-hp-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) 14px;margin-bottom:14px}
.re-hp-note{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-hp-rows{display:flex;flex-direction:column;gap:var(--re-space-4)}
#pane .re-row.re-hp-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px var(--re-space-6);align-items:start;padding:13px 15px;
  border:var(--re-border-width) solid var(--re-color-border);background:var(--re-color-surface-row)}
.re-hp-main{display:flex;flex-direction:column;gap:var(--re-space-3);min-width:0}
.re-hp-head{display:flex;flex-direction:column;gap:2px}
#pane .re-hp-head a{color:var(--re-color-text);font:700 var(--re-text-135) var(--re-font-ui);overflow-wrap:anywhere;text-decoration:none}
#pane .re-hp-head a:hover{color:var(--re-color-accent-text)}
.re-hp-head>span{color:var(--re-color-text-2);font-size:var(--re-text-130);text-wrap:pretty}
.re-hp-meta{display:flex;flex-wrap:wrap;gap:var(--re-space-2) 14px;color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
.re-hp-marks{display:flex;flex-wrap:wrap;gap:var(--re-space-2) 14px;font-size:var(--re-text-xs);font-weight:650}
.re-hp-marks>span{display:inline-flex;align-items:center;gap:4px}
.re-hp-marks svg.u-i{width:11px;height:11px;stroke-width:2.2}
.re-hp-fail{display:inline-flex;align-items:baseline;gap:6px;color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-hp-x{color:var(--re-color-down)}
.re-hp-x svg.u-i{width:13px;height:13px;stroke-width:2;vertical-align:-2px}
.re-hp-match{color:var(--re-color-text-meta);font-size:var(--re-text-xs)}
/* the 10-31 promote: each shipped page's proof line, and Needs a person's */
.re-hp-proof{display:inline-flex;align-items:center;gap:6px;color:var(--re-color-text-2);font-size:var(--re-text-xs)}
.re-hp-proof svg.u-i{display:block;flex:none;width:13px;height:13px;stroke-width:2;color:var(--re-color-text-muted)}
#pane .re-hp-proofp{margin:-6px 0 14px;color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-hp-done{display:inline-flex;align-items:center;gap:6px;color:var(--re-color-accent-text);font-size:var(--re-text-xs);font-weight:650}
.re-hp-done svg.u-i{width:13px;height:13px;stroke-width:2}
.re-hp-acts{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:flex-end;gap:7px}
#pane .re-btn.re-hp-primary,#pane .re-btn.re-hp-second{display:inline-flex;align-items:center;justify-content:center;min-height:32px;margin:0;
  padding:var(--re-space-3) 14px;border:0;border-radius:var(--re-radius-toggle);background:var(--re-color-accent);color:var(--re-color-on-accent);
  font:700 var(--re-text-sm) var(--re-font-ui);white-space:nowrap;cursor:pointer}
#pane .re-btn.re-hp-second{padding:var(--re-space-3) 13px;border:var(--re-border-width) solid var(--re-color-border-control);
  background:var(--re-color-surface-raised);color:var(--re-color-text-2);font-weight:650}
#pane .re-btn.re-hp-second:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
#pane .re-btn.re-hp-primary:disabled,#pane .re-btn.re-hp-second:disabled{opacity:.55;cursor:not-allowed}
.re-hp-primary:focus-visible,.re-hp-second:focus-visible,.re-hp-words:focus-visible,.re-hp-moreb:focus-visible{
  outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
/* the brief's publisher, asked once in the row before Confirm sends it */
.re-hp-ask{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--re-space-3) var(--re-space-5);padding:9px 14px;
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-container);background:var(--re-color-surface-raised)}
.re-hp-askl{display:flex;flex-direction:column;gap:4px;flex:1 1 260px;min-width:0;margin:0;color:var(--re-color-text-2);font-size:var(--re-text-sm)}
#pane .re-hp-askl .re-input{min-height:32px;margin:0;padding:5px 9px;border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-choice-sm);background:var(--re-color-surface);color:var(--re-color-text);font:600 var(--re-text-sm) var(--re-font-ui)}
.re-hp-none{padding:14px 15px;border:var(--re-border-width) dashed var(--re-color-border-control);color:var(--re-color-text-meta);
  font-size:var(--re-text-sm);line-height:1.5}
.re-hp-min{margin:14px 0 0;color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
.re-hp [data-ink="down"]{color:var(--re-color-down)}
.re-hp [data-ink="up"]{color:var(--re-color-up)}
.re-hp [data-ink="text"]{color:var(--re-color-text)}
.re-hp [data-ink="text2"]{color:var(--re-color-text-2)}
.re-hp [data-ink="muted"]{color:var(--re-color-text-muted)}
.re-hp [data-ink="accent"]{color:var(--re-color-accent-text)}
@media (max-width:979.98px){
  #pane .re-row.re-hp-row{grid-template-columns:minmax(0,1fr)}
  .re-hp-acts{flex-direction:column;align-items:stretch}
  #pane .re-btn.re-hp-primary,#pane .re-btn.re-hp-second{width:100%;min-height:44px}
}
/* page:pane-published end */

/* page:pane-health start */
/* The client page's Health tab (RE Live Client, PROMOTE 2026-10-21): the
   header card (the status as its glyph and word, the last check, the
   coverage); Needs a person on the down edge, each row its warning, what,
   path, reason and days, a verdict's mark and words, Confirm and False flag;
   the biweekly check-in, its lines under their sections, each label, state
   (glyph and word), words on one line that open in place, where to look on a
   hand-off and the flagged rows indented under it; the titles and schema
   lists, failing pages worst first; and Search Console beside History */
.re-hp-st{display:inline-flex;align-items:center;gap:7px;font-size:var(--re-text-sm);font-weight:650}
.re-hp-st svg.u-i{width:14px;height:14px;stroke-width:2}
.re-hp-reasonp{margin:var(--re-space-4) 0 0;color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
/* (the 11-01 port's parity: RE Live Client's line runs the card's width, past the shell's 90ch cap) */
#pane .re-hp-reasonp{max-width:none}
#pane .re-card.re-hp.re-hp-need{border-color:var(--re-color-down-border)}
#pane .re-hp-need h2{margin:0 0 14px}
.re-hp-what{display:inline-flex;align-items:center;gap:7px;color:var(--re-color-down);font:700 var(--re-text-135) var(--re-font-ui)}
.re-hp-what svg.u-i{width:14px;height:14px;stroke-width:2}
.re-hp-path{color:var(--re-color-text);font-size:var(--re-text-130);font-weight:600;overflow-wrap:anywhere}
.re-hp-reason{color:var(--re-color-text-2);font-size:var(--re-text-130);overflow-wrap:anywhere;text-wrap:pretty}
.re-hp-sub{display:flex;flex-wrap:wrap;gap:var(--re-space-1) 14px;margin-top:var(--re-space-2);color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-hp-sub2{color:var(--re-color-text-2);line-height:1.5}
.re-hp-groups{display:flex;flex-direction:column;gap:var(--re-space-6);margin-top:var(--re-space-6)}
.re-hp-group{display:flex;flex-direction:column}
.re-hp-sec{padding-bottom:var(--re-space-3);border-bottom:var(--re-border-width) solid var(--re-color-border-strong);color:var(--re-color-text-meta);
  font-size:var(--re-text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.re-hp-line{display:grid;grid-template-columns:minmax(140px,.8fr) auto minmax(0,2.4fr);gap:4px 14px;align-items:baseline;padding:11px 0;
  border-bottom:var(--re-border-width) solid var(--re-color-line)}
.re-hp-lab{min-width:0;color:var(--re-color-text);font-size:var(--re-text-130);font-weight:650}
.re-hp-lab>span{color:var(--re-color-text-muted);font-weight:500}
.re-hp-lst{display:inline-flex;align-items:center;gap:6px;font-size:var(--re-text-sm);font-weight:650;white-space:nowrap}
.re-hp-lst svg.u-i{width:14px;height:14px;stroke-width:2}
.re-hp-words{min-width:0;margin:0;padding:0;border:0;background:none;font:500 var(--re-text-sm)/1.5 var(--re-font-ui);text-align:left;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.re-hp-words.re-hp-open{white-space:normal}
.re-hp-where{grid-column:3;display:inline-flex;align-items:center;gap:6px;padding-left:16px;color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-hp-where svg.u-i{width:13px;height:13px;stroke-width:2}
.re-hp-lrows{grid-column:3;display:flex;flex-direction:column;gap:6px;padding:4px 0 0 16px}
.re-hp-lrows>span{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;font-size:var(--re-text-sm)}
.re-hp-lrows>span>b{flex:none;max-width:100%;color:var(--re-color-text);font-weight:650;overflow-wrap:anywhere}
.re-hp-lrows>span>span{color:var(--re-color-text-2)}
.re-hp-lrows>span>.re-hp-seen{color:var(--re-color-text-meta);white-space:nowrap}
.re-hp-lrows>span>b.re-hp-new{color:var(--re-color-accent-text);font-weight:700}
.re-hp-more{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-hp-nil{color:var(--re-color-text-muted);font-size:var(--re-text-sm)}
.re-hp-score{margin:var(--re-space-2) 0 0;color:var(--re-color-text-2);font-size:var(--re-text-sm);line-height:1.5;text-wrap:pretty}
.re-hp-list{display:flex;flex-direction:column;margin-top:var(--re-space-5)}
#pane .re-row.re-hp-lrow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:6px var(--re-space-6);align-items:start;padding:12px 0;
  box-shadow:0 -1px 0 var(--re-color-line)}
.re-hp-lcell{display:flex;flex-direction:column;gap:2px;min-width:0}
.re-hp-lhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px}
#pane .re-hp-lhead a,.re-hp-lcell>b{color:var(--re-color-text);font:700 var(--re-text-135) var(--re-font-ui);overflow-wrap:anywhere;text-decoration:none}
#pane .re-hp-lhead a:hover{color:var(--re-color-accent-text)}
.re-hp-key{color:var(--re-color-text-2);font:700 var(--re-text-95) var(--re-font-ui);letter-spacing:.08em;text-transform:uppercase}
.re-hp-ltitle{font-size:var(--re-text-sm);text-wrap:pretty}
.re-hp-types{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-hp-lfails{display:flex;flex-direction:column;gap:4px;min-width:0}
.re-hp-lfails .re-hp-fail{display:flex}
.re-hp-moreb{min-height:32px;margin:var(--re-space-4) 0 0;padding:var(--re-space-3) 13px;border:var(--re-border-width) solid var(--re-color-border-control);
  border-radius:var(--re-radius-toggle);background:var(--re-color-surface-raised);color:var(--re-color-text-2);font:650 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
#pane .re-card.re-hp-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:1px;margin-bottom:var(--re-space-5);padding:0;
  border:var(--re-border-width) solid var(--re-color-border);border-radius:var(--re-radius-container);background:var(--re-color-line);overflow:hidden;
  box-shadow:var(--re-shadow-card)}
.re-hp-cell{display:flex;flex-direction:column;gap:6px;padding:18px var(--re-space-7);background:var(--re-color-surface)}
.re-hp-ch{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-2) 10px}
#pane .re-hp-ch h2{margin:0;font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em}
.re-hp-ch>span{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-hp-scg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:6px}
.re-hp-scw{display:flex;flex-direction:column;gap:2px;min-width:0}
.re-hp-scw>span:first-child{color:var(--re-color-text-meta);font-size:var(--re-text-105);letter-spacing:.06em;text-transform:uppercase}
.re-hp-scw>span:last-child{display:inline-flex;align-items:flex-start;gap:6px;color:var(--re-color-text-muted);font-size:var(--re-text-sm);
  font-weight:500;line-height:1.4;text-wrap:pretty}
.re-hp-scw svg.u-i{width:14px;height:14px;stroke-width:2}
.re-hp-hist{display:flex;justify-content:space-between;gap:10px;color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-hp-hist>span:last-child{color:var(--re-color-text-meta);white-space:nowrap}
.re-hp-nohist{margin-top:6px;color:var(--re-color-text-muted);font-size:var(--re-text-sm);line-height:1.5}
/* Dismiss on each Needs a person row, Design's quiet x and word after
   Confirm and False flag, and the line of what the team dismissed with
   Bring them back */
.re-hp-dis{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:32px;margin:0;padding:0 6px;border:0;
  background:none;color:var(--re-color-text-muted);font:650 var(--re-text-xs) var(--re-font-ui);white-space:nowrap;cursor:pointer}
.re-hp-dis:hover{color:var(--re-color-text)}
.re-hp-dis svg.u-i{width:13px;height:13px;stroke-width:2}
.re-hp-gone{display:flex;flex-wrap:wrap;align-items:center;gap:var(--re-space-3) var(--re-space-5);margin-top:var(--re-space-4);
  color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-hp-gone b{color:var(--re-color-text-2)}
.re-hp-back{margin:0;padding:2px 0;border:0;background:none;color:var(--re-color-text-2);font:650 var(--re-text-xs) var(--re-font-ui);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.re-hp-dis:focus-visible,.re-hp-back:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
@media (max-width:979.98px){
  .re-hp-line{grid-template-columns:minmax(0,1fr) auto}
  .re-hp-dis{width:100%;min-height:44px}
  .re-hp-words,.re-hp-where,.re-hp-lrows{grid-column:1/-1}
  #pane .re-row.re-hp-lrow{grid-template-columns:minmax(0,1fr)}
}
/* page:pane-health end */

/* page:health start */
/* Health (page-health, 2026-10-18): RE Live's Site health card at #/health,
   every site in one table, worst first, as the Design draws it. A status is
   a shape and its word in one ink, never a colour alone: Flagged a filled
   square in the down red, OK a ring in the up green, Not covered a triangle
   in the accent text, No access a dash in meta. Below 980px (the Design's
   narrow) the table is one column, its head row goes and the last check
   says Checked; every cell names itself for a screen reader either way. */
.re-hv-card{margin-top:22px;border:var(--re-border-width) solid var(--re-color-border);background:var(--re-sheen),var(--re-color-surface);
  border-radius:var(--re-radius-container);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-hv-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) var(--re-space-5);padding:18px var(--re-space-7) 14px}
.re-hv-head h2{margin:0;color:var(--re-color-text);font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em}
.re-hv-meta,.re-hv-aside{font-size:var(--re-text-sm);color:var(--re-color-text-meta)}
.re-hv-aside{margin-left:auto}
/* The Design's six columns. Each row is a subgrid of the body where the
   browser has one, so a column lines up down the table; elsewhere each row
   keeps the same template on its own, as the Design draws it. */
.re-hv-body{display:grid;grid-template-columns:minmax(0,1.3fr) auto minmax(0,.8fr) minmax(0,2fr) minmax(0,1.3fr) auto;column-gap:14px;
  padding:0 var(--re-space-7) var(--re-space-7)}
.re-hv-body>.u-none{grid-column:1/-1}
.re-hv-cols,.re-hv-row{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.3fr) auto minmax(0,.8fr) minmax(0,2fr) minmax(0,1.3fr) auto;gap:6px 14px}
@supports (grid-template-columns:subgrid){.re-hv-cols,.re-hv-row{grid-template-columns:subgrid}}
.re-hv-cols{padding:0 0 var(--re-space-3);font-size:var(--re-text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--re-color-text-meta);border-bottom:var(--re-border-width) solid var(--re-color-border-strong)}
.re-hv-row{align-items:center;padding:13px 0;box-shadow:0 -1px 0 var(--re-color-line);color:var(--re-color-text);text-decoration:none}
.re-hv-row.re-hv-dim{color:var(--re-color-text-muted)}
a.re-hv-row:hover{background:var(--re-color-surface-hover)}
a.re-hv-row:focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:2px}
.re-hv-who{display:flex;flex-direction:column;gap:2px;min-width:0}
.re-hv-name{font-size:var(--re-text-140);font-weight:650;color:var(--re-color-text);overflow-wrap:anywhere}
.re-hv-sub{font-size:var(--re-text-xs);color:var(--re-color-text-meta);overflow-wrap:anywhere}
.re-hv-st{display:inline-flex;align-items:center;gap:7px;font-size:var(--re-text-130);font-weight:650;white-space:nowrap}
.re-hv-st svg{width:11px;height:11px;flex:none}
.re-hv-st-flagged{color:var(--re-color-down)}
.re-hv-st-ok{color:var(--re-color-up)}
.re-hv-st-not_covered{color:var(--re-color-accent-text)}
.re-hv-st-no_access{color:var(--re-color-text-meta)}
.re-hv-when{display:flex;flex-direction:column;gap:2px;font-size:var(--re-text-sm);color:var(--re-color-text-2)}
.re-hv-stale{font-weight:650;color:var(--re-color-text)}
.re-hv-pre{display:none}
.re-hv-issues{display:flex;flex-direction:column;gap:3px;min-width:0;font-size:var(--re-text-sm);color:var(--re-color-text-2)}
.re-hv-issue{display:flex;flex-wrap:wrap;gap:2px 8px}
.re-hv-issue b{font-weight:650;color:var(--re-color-text)}
.re-hv-page{overflow-wrap:anywhere;color:var(--re-color-text-2)}
.re-hv-age{white-space:nowrap;color:var(--re-color-text-muted)}
.re-hv-none{color:var(--re-color-text-muted)}
.re-hv-sc{display:inline-flex;align-items:center;gap:7px;font-size:var(--re-text-sm);color:var(--re-color-text-muted)}
.re-hv-sc svg.u-i{width:12px;height:12px;stroke-width:2}
.re-hv-chev{justify-self:end;color:var(--re-color-text-meta)}
.re-hv-chev svg.u-i{width:14px;height:14px;stroke-width:2}
@media (max-width:979px){
  .re-hv-cols{display:none}
  .re-hv-body,.re-hv-row{grid-template-columns:minmax(0,1fr)}
  .re-hv-when{display:block}
  .re-hv-pre{display:inline}
  .re-hv-stale{display:block}
}
/* page:health end */
/* page:people start */
/* People and My activity (the Design's #/people, 2026-10-18): a Settings
   sub-view, never a rail item. The Design's two cards, their rows and the
   state marks, each an icon and a word (colour never carries it alone).
   Tokens only; the px values are the Design's own. */
.re-people .re-card.re-pp-card{margin-top:14px;border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-container);background:var(--re-sheen),var(--re-color-surface);
  backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);box-shadow:var(--re-shadow-card)}
.re-people .re-card.re-pp-card:first-of-type{margin-top:22px}
.re-pp-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-4) var(--re-space-5);padding:18px var(--re-space-7) 14px}
.re-pp-top h2{margin:0;color:var(--re-color-text);font-size:var(--re-text-lg);font-weight:650;letter-spacing:-0.01em;line-height:inherit}
.re-pp-meta,.re-pp-aside{color:var(--re-color-text-meta);font-size:var(--re-text-sm)}
.re-pp-aside,.re-pp-acts{margin-left:auto}
.re-pp-acts{display:inline-flex;flex-wrap:wrap;gap:var(--re-space-4)}
.re-btn.re-pp-btn{display:inline-flex;align-items:center;min-height:32px;padding:5px 11px;border-radius:var(--re-radius-choice-sm);
  border:var(--re-border-width) solid var(--re-color-border-control);background:var(--re-color-surface-raised);
  color:var(--re-color-text-2);font:650 var(--re-text-120) var(--re-font-ui);text-decoration:none}
.re-pp-list{display:flex;flex-direction:column;padding:0 var(--re-space-7) var(--re-space-7)}
/* RE Live's People (PROMOTE, 2026-11-04): Email, Role, Clients, Status, Last sign-in and the row menu; at 760px
   and below each row folds into one button. The Add person drawer and the Turn off question sit over a scrim */
.re-pp-top{align-items:center}
.re-pp-ttl{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--re-space-2) var(--re-space-5);min-width:0}
.re-btn.re-pp-add{margin-left:auto;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;padding:0 16px;border:0;
  border-radius:var(--re-radius-choice);background:var(--re-color-accent);color:var(--re-color-on-accent);font:700 var(--re-text-130) var(--re-font-ui);cursor:pointer;white-space:nowrap}
.re-pp-add .u-i{width:15px;height:15px;stroke-width:2.2}
.re-pp-head,.re-pp-row{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,.6fr) minmax(0,1fr) minmax(0,.6fr) minmax(0,.8fr) 36px;gap:6px 14px}
.re-pp-head{padding:0 0 var(--re-space-3);color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;border-bottom:var(--re-border-width) solid var(--re-color-border-strong)}
.re-pp-row{align-items:center;padding:12px 0;box-shadow:0 -1px 0 var(--re-color-line)}
.re-pp-who{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;min-width:0}
.re-pp-name{color:var(--re-color-text);font-size:var(--re-text-140);font-weight:650;overflow-wrap:anywhere}
.re-pp-off .re-pp-name{color:var(--re-color-text-2)}
.re-pp-you{color:var(--re-color-text-meta);font-size:var(--re-text-xs);font-weight:500}
.re-pp-role,.re-pp-cl{color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-pp-cl{justify-self:start;cursor:default}
.re-pp-st{display:inline-flex;align-items:center;gap:7px;color:var(--re-color-text);font-size:var(--re-text-130);font-weight:650;white-space:nowrap}
.re-pp-st .u-i{width:13px;height:13px;flex:none}
.re-pp-last{color:var(--re-color-text-2);font-size:var(--re-text-sm)}
.re-pp-st.re-pp-muted,.re-pp-last.re-pp-muted{color:var(--re-color-text-muted)}
.re-pp-more{position:relative;justify-self:end}
.re-pp-dots{display:grid;place-items:center;width:36px;height:36px;padding:0;border:0;border-radius:var(--re-radius-choice-sm);
  background:none;color:var(--re-color-text-meta);cursor:pointer}
.re-pp-dots:hover{color:var(--re-color-text);background:var(--re-color-surface-hover)}
.re-pp-dots .u-i{width:18px;height:18px;fill:currentColor;stroke:none}
.re-pp-menu{position:absolute;z-index:30;right:0;top:calc(100% + 4px);display:flex;flex-direction:column;gap:2px;width:200px;padding:var(--re-space-3);
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-container);
  background:linear-gradient(var(--re-color-surface-raised),var(--re-color-surface-raised)),var(--re-color-bg);box-shadow:var(--re-shadow-card)}
.re-pp-mi{display:flex;align-items:center;width:100%;min-height:36px;padding:0 10px;border:0;border-radius:var(--re-radius-choice-sm);
  background:none;color:var(--re-color-text);font:600 var(--re-text-sm) var(--re-font-ui);text-align:left;cursor:pointer}
.re-pp-mi:hover{background:var(--re-color-surface-hover)}
.re-pp-mi:disabled,.re-pp-fb:disabled{color:var(--re-color-text-muted);cursor:not-allowed}
.re-pp-row>.re-pp-fold,.re-pp-row>.re-pp-fbody{display:none}
.re-pp-fold{grid-template-columns:minmax(0,1fr) 44px;align-items:center;gap:4px 10px;width:100%;min-height:44px;padding:0;border:0;
  background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.re-pp-fwho{display:flex;flex-direction:column;gap:3px;min-width:0}
.re-pp-fsub{display:flex;flex-wrap:wrap;align-items:center;gap:2px 12px}
.re-pp-fsub .re-pp-st{gap:6px;font-size:var(--re-text-sm)}
.re-pp-chev{display:grid;place-items:center;width:44px;height:44px;color:var(--re-color-text-meta)}
.re-pp-chev .u-i{width:16px;height:16px;stroke-width:2}
.re-pp-chev.re-on{transform:rotate(90deg)}
.re-pp-fbody{flex-direction:column;gap:8px;padding:2px 0 8px}
.re-pp-fl{display:flex;flex-wrap:wrap;gap:2px 8px;font-size:var(--re-text-sm)}
.re-pp-fl>span:first-child{color:var(--re-color-text-meta)}
.re-pp-fl>span:last-child{color:var(--re-color-text-2);overflow-wrap:anywhere}
.re-pp-facts{display:flex;flex-wrap:wrap;gap:8px}
.re-pp-fb{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:var(--re-radius-choice-sm);
  border:var(--re-border-width) solid var(--re-color-border-control);background:var(--re-color-surface-raised);color:var(--re-color-text);
  font:650 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-pp-scrim{position:fixed;z-index:45;inset:0;background:var(--re-color-rail-shadow)}
.re-pp-scrim.re-pp-center{z-index:47;display:grid;place-items:center;padding:24px}
.re-pp-drawer{position:fixed;z-index:46;top:0;bottom:0;right:0;width:min(440px,100vw);display:flex;flex-direction:column;gap:var(--re-space-6);
  padding:var(--re-space-7,28px);overflow-y:auto;border-left:var(--re-border-width) solid var(--re-color-border-control);
  background:linear-gradient(var(--re-color-surface-raised),var(--re-color-surface-raised)),var(--re-color-bg);color:var(--re-color-text);
  box-shadow:var(--re-shadow-card);font:400 var(--re-text-130)/1.45 var(--re-font-ui)}
.re-pp-dhead{display:flex;align-items:flex-start;gap:var(--re-space-4)}
.re-pp-dhead>span{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}
.re-pp-dhead h2{margin:0;font:700 var(--re-text-180)/1.25 var(--re-font-ui);letter-spacing:-0.01em}
.re-pp-demail{color:var(--re-color-text-2);overflow-wrap:anywhere}
.re-pp-x{display:grid;place-items:center;width:44px;height:44px;flex:none;margin:-8px -10px 0 0;border:0;background:none;color:var(--re-color-text-muted);cursor:pointer}
.re-pp-x .u-i{width:18px;height:18px}
.re-pp-field{display:flex;flex-direction:column;gap:8px}
.re-pp-field.re-pp-ef{gap:6px}
.re-pp-field label{display:flex;align-items:baseline;gap:8px}
.re-pp-lab{font:650 var(--re-text-95) var(--re-font-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--re-color-text-muted)}
.re-pp-req{font-size:var(--re-text-xs);color:var(--re-color-text-meta)}
.re-pp-field .re-input{min-height:44px;padding:0 12px;border-radius:var(--re-radius-choice-sm);border:var(--re-border-width) solid var(--re-color-border-control);
  background:var(--re-color-surface);color:var(--re-color-text);font:600 var(--re-text-150) var(--re-font-ui)}
.re-pp-field .re-input[aria-invalid="true"]{border-color:var(--re-color-down)}
.re-pp-field .re-input.re-pp-q{min-height:36px;font:500 var(--re-text-130) var(--re-font-ui)}
.re-pp-err{display:flex;align-items:center;gap:6px;font-size:var(--re-text-sm);font-weight:650;color:var(--re-color-down)}
.re-pp-err .u-i{width:14px;height:14px;flex:none}
.re-pp-radios{display:flex;flex-wrap:wrap;gap:8px}
.re-pp-radio{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border-radius:var(--re-radius-choice);
  border:var(--re-border-width) solid var(--re-color-border-control);background:transparent;color:var(--re-color-text-2);font:650 var(--re-text-sm) var(--re-font-ui);cursor:pointer}
.re-pp-radio.re-on{border-color:var(--re-color-accent);background:var(--re-color-accent);color:var(--re-color-on-accent)}
.re-pp-picks{display:flex;flex-direction:column;max-height:280px;overflow-y:auto;border:var(--re-border-width) solid var(--re-color-border);
  border-radius:var(--re-radius-choice-sm);background:var(--re-color-surface)}
.re-pp-pick{display:flex;align-items:center;gap:10px;min-height:36px;padding:0 12px;box-shadow:0 -1px 0 var(--re-color-line);font-size:var(--re-text-130);cursor:pointer}
.re-pp-pick input{width:16px;height:16px;flex:none;margin:0;accent-color:var(--re-color-accent)}
.re-pp-pick span{min-width:0;overflow-wrap:anywhere}
.re-pp-picks .re-pp-none{padding:12px}
.re-pp-picked{font-size:var(--re-text-sm);color:var(--re-color-text-meta)}
.re-pp-note{margin:0;font-size:var(--re-text-sm);line-height:1.5;color:var(--re-color-text-muted);text-wrap:pretty}
.re-pp-dacts{display:flex;flex-wrap:wrap;gap:var(--re-space-3);margin-top:auto;padding-top:var(--re-space-4)}
.re-pp-confirm .re-pp-dacts{margin-top:0;padding-top:0}
.re-pp-save{min-height:36px;padding:0 22px;border:0;border-radius:var(--re-radius-choice);background:var(--re-color-accent);color:var(--re-color-on-accent);
  font:700 var(--re-text-130) var(--re-font-ui);cursor:pointer}
.re-pp-cancel{min-height:36px;padding:0 16px;border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-choice);
  background:var(--re-color-surface-raised);color:var(--re-color-text-2);font:650 var(--re-text-130) var(--re-font-ui);cursor:pointer}
.re-pp-cancel:hover{color:var(--re-color-text);border-color:var(--re-color-border-strong)}
.re-pp-confirm{display:flex;flex-direction:column;gap:var(--re-space-6);width:min(100%,440px);padding:var(--re-space-7,28px);
  border:var(--re-border-width) solid var(--re-color-border-control);border-radius:var(--re-radius-container);
  background:linear-gradient(var(--re-color-surface-raised),var(--re-color-surface-raised)),var(--re-color-bg);color:var(--re-color-text);
  box-shadow:var(--re-shadow-card);font:400 var(--re-text-135)/1.5 var(--re-font-ui)}
.re-pp-confirm p{margin:0;text-wrap:pretty;overflow-wrap:anywhere}
.re-pp-offyes{min-height:36px;padding:0 18px;border:var(--re-border-width) solid var(--re-color-down-border);border-radius:var(--re-radius-choice);
  background:transparent;color:var(--re-color-down);font:700 var(--re-text-130) var(--re-font-ui);cursor:pointer}
.re-pp-act{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:baseline;padding:11px 0;box-shadow:0 -1px 0 var(--re-color-line)}
.re-pp-what{color:var(--re-color-text-2);font-size:var(--re-text-135)}
.re-pp-what b{color:var(--re-color-text);font-weight:650}
.re-pp-when{color:var(--re-color-text-meta);font-size:var(--re-text-xs);white-space:nowrap}
.re-pp-sub{margin:0;padding:var(--re-space-5) var(--re-space-7) var(--re-space-3);color:var(--re-color-text-meta);font-size:var(--re-text-xs);
  font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.re-pp-none{margin:0;padding:var(--re-space-4) 0 0;color:var(--re-color-text-muted);font-size:var(--re-text-sm);line-height:1.5}
@media (max-width:979px){
  .re-pp-act{grid-template-columns:minmax(0,1fr)}
  .re-pp-when{white-space:normal}
}
@media (max-width:760px){
  .re-pp-head{display:none}
  .re-pp-row{grid-template-columns:minmax(0,1fr);padding:6px 0}
  .re-pp-row>*{display:none}
  .re-pp-row>.re-pp-fold{display:grid}
  .re-pp-row>.re-pp-fbody{display:flex}
  .re-btn.re-pp-add,.re-pp-radio,.re-pp-pick,.re-pp-save,.re-pp-cancel,.re-pp-offyes{min-height:44px}
  .re-pp-field .re-input.re-pp-q{min-height:44px}
  .re-pp-picks{max-height:45vh}
  .re-pp-drawer{left:0;width:100vw;border-left:0;padding:20px 16px 24px}
}
/* page:people end */

/* motion start */
/* Motion (UI port Step 6): every animation the brief names, on the
   Design's timings (MOTION.md) where it has them and the nearest token
   where it does not. Only transform and opacity move; colours and borders
   fade; the one size that animates is a details element's body, which sits
   below everything it pushes. Every duration and curve is a token, and
   under prefers-reduced-motion tokens.css sets each motion token to 0ms
   while the global block above stops every transition and animation. The
   page script only switches the states named here, after checking reduced
   motion itself. */

/* The pane (MOTION.md: Pane slide, Pane fade). The grid switches in the
   first frame; the pane's inner content moves on its own layer, its states
   on data-re-motion. from: the start, 28px to the right and transparent,
   no transition. open: to rest, the slide over the pane token on the pane
   curve, the fade over the slow token after the delay token. close: the
   reverse, the fade with no delay (the none token); the script switches
   the grid back when the fade ends. While a state is set the pane clips
   sideways, so the 28px never puts a scrollbar in it. */
#pane[data-re-motion]{overflow-x:hidden}
#pane[data-re-motion="from"] .re-pane-inner{opacity:0;transform:translateX(28px);transition:none}
#pane[data-re-motion="open"] .re-pane-inner{
  transition:opacity var(--re-motion-slow) var(--re-ease-standard) var(--re-motion-delay),
    transform var(--re-motion-pane) var(--re-ease-pane)}
#pane[data-re-motion="close"] .re-pane-inner{opacity:0;transform:translateX(28px);
  transition:opacity var(--re-motion-slow) var(--re-ease-standard) var(--re-motion-none),
    transform var(--re-motion-pane) var(--re-ease-pane)}
/* The close's grid switch (a large reflow of the main column) lands when the
   fade ends, or at the latest one fast token later (reMotionEnd's fallback),
   so slow plus fast (260 + 200 = 460ms) keeps it inside the click's 500ms
   input window and out of CLS. A sync that lengthens either token past that
   window would make the reflow count: run_tests holds the margin
   (test_uiport_qafix_pane_close_lands_inside_the_input_window). */

/* Drawers (MOTION.md: Drawer chevron, home and pane). The chevron turns a
   quarter as the drawer opens, over the fast token on the Overview and the
   base token in the pane, both on the out curve. */
.re-drawer>.re-drawer-head svg[data-chev]{transition:transform var(--re-motion-fast) var(--re-ease-out)}
.re-pane .re-drawer>.re-drawer-head svg[data-chev]{transition-duration:var(--re-motion-base)}
.re-drawer[open]>.re-drawer-head svg[data-chev]{transform:rotate(90deg)}
/* The body of any details in the main column or the pane: where the
   browser has ::details-content and interpolate-size it opens and closes
   over the fast token, opacity and block-size, content-visibility held
   through the close. The one size that animates: a details body sits below
   everything it pushes, and the push follows the click, so it is
   input-initiated and outside CLS. Anywhere else it opens at once. It clips
   while it moves, with room left for a focus ring. */
@supports selector(::details-content){
  .re-app details{interpolate-size:allow-keywords}
  .re-app details::details-content{block-size:0;opacity:0;overflow:clip;
    overflow-clip-margin:calc(var(--re-focus-width) * 2);
    transition:block-size var(--re-motion-fast) var(--re-ease-out),opacity var(--re-motion-fast) var(--re-ease-out),
      content-visibility var(--re-motion-fast) var(--re-ease-out) allow-discrete}
  .re-app details[open]::details-content{block-size:auto;opacity:1}
}
@media (prefers-reduced-motion:reduce){
  .re-app details::details-content{transition:none}
}

/* Hover and press (Step 6 item 4). Colour, background and border fade over
   the fast token on the out curve, on buttons, cards, rows (list, activity
   and thread rows), tabs, chips, rail items, switch cards and the rail's
   own controls. A press darkens a button's fill, the accent's pressed value
   on a primary and the raised surface on the rest, and scales the button to
   .98: a transform, so nothing around it moves. Buttons only; no lift, no
   shadow. Focus rings are outlines and never fade. A primary is any button
   drawn in the accent: the Overview's re-ov-primary, the pane's next step
   (re-pane-cta), a picked segment and the older views' u-primary. The older
   views' chips (u-chip, kept in the pane's tabs) fade like re-chip, and
   their link buttons (u-linkbtn: the summary card's Copy client link,
   Triage sprint and Full feed) fade and press like a button (UI port QA
   fix 1). */
.re-row,.re-card,.re-roster-card,.re-switch-card,.re-tab,.re-chip,.u-chip,.re-rail-item,.re-avatar{
  transition:background-color var(--re-motion-fast) var(--re-ease-out),
    border-color var(--re-motion-fast) var(--re-ease-out),color var(--re-motion-fast) var(--re-ease-out)}
.re-btn,.u-btn,.u-linkbtn,.re-size-btn,.re-theme-toggle{
  transition:background-color var(--re-motion-fast) var(--re-ease-out),
    border-color var(--re-motion-fast) var(--re-ease-out),color var(--re-motion-fast) var(--re-ease-out),
    transform var(--re-motion-fast) var(--re-ease-out)}
.re-btn:active:not(:disabled),.u-btn:active:not(:disabled),.u-linkbtn:active:not(:disabled),
.re-size-btn:active:not(:disabled),.re-theme-toggle:active:not(:disabled){transform:scale(.98)}
.re-btn:active:not(:disabled):not(.u-primary):not(.re-ov-primary):not(.re-pane-cta):not(.re-seg-btn[aria-pressed="true"]),
.u-btn:active:not(:disabled):not(.u-primary){
  background-color:var(--re-color-surface-raised)}
.re-btn.u-primary:active:not(:disabled),.u-btn.u-primary:active:not(:disabled),
.re-btn.re-ov-primary:active:not(:disabled),.re-btn.re-pane-cta:active:not(:disabled),
.re-btn.re-seg-btn[aria-pressed="true"]:active:not(:disabled){
  background-color:var(--re-color-accent-press);border-color:var(--re-color-accent-press)}

/* Tabs (Step 6 item 5). The client page's strip (uTabsPlace, uPanelSwap):
   the indicator slides over the fast token on the out curve, its width set
   at once since only transform and opacity move, and the panel swap's two
   halves (out, lifting 4px; in, settling from 4px below) take half the
   fast token each. These win over the older sheet's rules, which read the
   same tokens through aliases. The pane's tab panels (.re-tabpanel inside a
   data-re-swap container): the incoming panel fades and lifts 4px over the
   fast token as it shows; data-re-swap="off" keeps a panel still through a
   patch in place. */
.u-tabs-ind{transition:transform var(--re-motion-fast) var(--re-ease-out)}
#utab{transition:opacity calc(var(--re-motion-fast) / 2) var(--re-ease-out),
  transform calc(var(--re-motion-fast) / 2) var(--re-ease-out)}
[data-re-swap]:not([data-re-swap="off"])>.re-tabpanel:not([hidden]){
  animation:re-motion-rise var(--re-motion-fast) var(--re-ease-out) backwards}
@keyframes re-motion-rise{from{opacity:0;transform:translateY(4px)}}

/* Skeletons (Step 6 item 6). A block with the re-skeleton class, sized by
   its renderer like the block it stands in for, takes the skeleton fill
   (the hover surface) and pulses its opacity from 1 to .55 and back. The
   Design's tokens.css has no loop token (RELIVE, 2026-09-26: the app's
   shimmer extension is gone and no token is added), so each half of the
   pulse runs over the pane token, the Design's longest duration and the
   nearest to the old 1.4s loop, alternating. Opacity only: no sweep, no
   gradient. */
.re-skeleton{background-color:var(--re-color-surface-hover);
  animation:re-motion-shimmer var(--re-motion-pane) var(--re-ease-standard) infinite alternate}
@keyframes re-motion-shimmer{from{opacity:1}to{opacity:.55}}

/* Entry (Step 6 item 7). The direct children of a data-re-enter container
   (the roster's cards or rows, the activity stream, a pane tab's rows)
   fade from 0 and rise 4px over the fast token on the out curve when they
   first render or re-render after a filter change, a tenth of the fast
   token (20ms) apart and capped at eight: later items start with the
   eighth. The hourly patch in place sets data-re-enter="off" and nothing
   moves. The delays follow the shorthand, which would reset them. */
[data-re-enter]:not([data-re-enter="off"])>*{animation:re-motion-rise var(--re-motion-fast) var(--re-ease-out) backwards}
[data-re-enter]>:nth-child(2){animation-delay:calc(var(--re-motion-fast) / 10)}
[data-re-enter]>:nth-child(3){animation-delay:calc(var(--re-motion-fast) / 10 * 2)}
[data-re-enter]>:nth-child(4){animation-delay:calc(var(--re-motion-fast) / 10 * 3)}
[data-re-enter]>:nth-child(5){animation-delay:calc(var(--re-motion-fast) / 10 * 4)}
[data-re-enter]>:nth-child(6){animation-delay:calc(var(--re-motion-fast) / 10 * 5)}
[data-re-enter]>:nth-child(7){animation-delay:calc(var(--re-motion-fast) / 10 * 6)}
[data-re-enter]>:nth-child(n+8){animation-delay:calc(var(--re-motion-fast) / 10 * 7)}

/* View toggle (Step 6 item 5). When the roster (#re-roster) changes between
   cards and list, the view swaps in one frame and only the incoming view
   fades in, over the fast token on the out curve: the script marks the
   change with re-motion-view and finishes the items' entry at once, so the
   swap is one fade and no height is animated. */
#re-roster.re-motion-view{animation:re-motion-fade var(--re-motion-fast) var(--re-ease-out)}
@keyframes re-motion-fade{from{opacity:0}}

/* Toasts (Step 6 item 8): toast() and every undo toast built on it enter
   with opacity and a rise from 8px below over the fast token on the out
   curve, and leave with opacity over the fast token (re-toast-out, set by
   the script when the lifetime is up or undo is pressed). The box is fixed
   to the corner, so neither moves the page. */
.re-toast{animation:re-motion-toast var(--re-motion-fast) var(--re-ease-out) backwards}
.re-toast.re-toast-out{opacity:0;transition:opacity var(--re-motion-fast) var(--re-ease-out)}
@keyframes re-motion-toast{from{opacity:0;transform:translateY(8px)}}
/* motion end */

/* page:first-login start */
/* RE Live: First login (page-firstlogin, 2026-10-18), RE Live's gate: the
   set-password page the engine serves a session on the default password
   (SET_PASSWORD_PAGE). Each rule is the inline style RE Live's own element
   carries, on the same tokens. The page keeps LOGIN_PAGE's head, so that
   sheet's bare element rules (body, h1, p, input, button, .err) reach this
   markup too: every rule here is on the re-fl body class or its own classes,
   so the login page is untouched, and overrides them where RE Live differs.
   The twin glow is #re-glow (page:shell); the dust lane is not drawn here. */
body.re-fl{box-sizing:border-box;padding:24px}
.re-fl-card{display:flex;flex-direction:column;gap:18px;width:100%;max-width:440px;padding:28px;box-sizing:border-box;
  border:var(--re-border-width) solid var(--re-color-border);background:var(--re-sheen),var(--re-color-surface);
  border-radius:var(--re-radius-container);backdrop-filter:var(--re-glass-blur);-webkit-backdrop-filter:var(--re-glass-blur);
  box-shadow:var(--re-shadow-card)}
.re-fl-brand{display:flex;align-items:center;gap:10px}
.re-fl-brand svg{width:22px;height:22px;flex:none}
.re-fl-brand path{fill:none;stroke:var(--re-color-accent);stroke-width:2.75;stroke-linecap:round;stroke-linejoin:round}
.re-fl-brand circle{fill:var(--re-color-accent)}
.re-fl-brand>span{font-size:var(--re-text-130);font-weight:650;color:var(--re-color-text-2)}
.re-fl-brand>span>span{color:var(--re-color-accent-text)}
.re-fl-head{display:flex;flex-direction:column;gap:6px}
.re-fl-head h1{margin:0;font-size:var(--re-text-240);font-weight:700;letter-spacing:-0.02em}
.re-fl-head p{margin:0;font-size:var(--re-text-135);line-height:1.5;color:var(--re-color-text-2);text-wrap:pretty}
.re-fl-field{display:flex;flex-direction:column;gap:6px}
.re-fl-field label{font-size:var(--re-text-xs);font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--re-color-text-meta)}
.re-fl-row{display:flex;gap:8px}
.re-fl-row .re-input{flex:1;min-width:0}
.re-fl-field .re-input{min-height:44px;padding:0 12px;border-radius:var(--re-radius-choice-sm);
  border:var(--re-border-width) solid var(--re-color-border-control);background:var(--re-color-surface-raised);
  color:var(--re-color-text);font:600 var(--re-text-150) var(--re-font-ui)}
/* the Show toggle is a quiet button: the login sheet's accent fill and hover do not apply */
.re-fl-show,.re-fl-show:hover{width:auto;margin:0;min-height:44px;padding:0 14px;border-radius:var(--re-radius-choice-sm);
  border:var(--re-border-width) solid var(--re-color-border-control);background:var(--re-color-surface-raised);
  color:var(--re-color-text-2);font:650 var(--re-text-sm) var(--re-font-ui)}
.re-fl-rules{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.re-fl-rules li{display:flex;align-items:center;gap:8px;font-size:var(--re-text-130);color:var(--re-color-text-muted)}
.re-fl-rules li[data-ok="1"]{color:var(--re-color-text)}
.re-fl-rules svg{width:14px;height:14px;flex:none;display:block;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
/* each rule's state word, for a screen reader (the icon's shape says it on screen) */
.re-fl-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.re-fl-save{display:inline-flex;align-items:center;justify-content:center;margin:0;min-height:44px;padding:0 16px;
  border-radius:var(--re-radius-choice);font:700 var(--re-text-135) var(--re-font-ui)}
.re-fl-save:disabled,.re-fl-save:disabled:hover{opacity:.5;background:var(--re-color-accent)}
.re-fl .err{margin:0;min-height:0}
.re-fl .err:empty{display:none}
.re-fl .err svg{width:16px;height:16px;vertical-align:-3px;margin-right:6px;fill:none;stroke:currentColor;
  stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.re-fl-foot{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:var(--re-text-120);line-height:1.5;
  color:var(--re-color-text-muted)}
.re-fl-foot a{font-weight:650;color:var(--re-color-text-2);text-decoration:none}
.re-fl-foot a:hover{color:var(--re-color-accent-text)}
.re-fl :focus-visible{outline:var(--re-focus-width) solid var(--re-color-focus);outline-offset:var(--re-space-1)}
/* page:first-login end */