/* THE AI SECTION. Shell: /ui/ai-section.js. Plan: docs/AI-SECTION-PLAN.md;
   approved mockup: mockups/ai.html (owner, 2026-09-22).

   Owner: "It should look like actual AI software like Claude." Studied, not
   copied. What that kind of software has in common, and what this sheet keeps:

   · the COMPOSER is the hero — a box you type into, not a dashboard you read;
   · a calm warm canvas: paper, one accent, almost no borders — hierarchy comes
     from type and space, because AI software earns trust by being quiet;
   · a centred reading column for anything conversational;
   · what it did, with the reason, instead of claims about what it is.

   Reachly's own voice on top: Plus Jakarta Sans for the interface, Fraunces
   (the marketing site's display face) for the greeting and titles only, coral
   as the single accent, line icons, no emoji.

   This sheet loads LAST, because half its job is re-skinning the Ask engine's
   own markup (.askp-*, styled in reachly-b2b-theme.css under .askp-scope).
   Those rules and these have equal weight, so order is what decides. */

/* ═══ tokens ═══════════════════════════════════════════════════════════════ */
.rlx.rl-ai{
  --paper:#faf9f6;--paper2:#f3f1ec;--ink:#1b1a17;--ink2:#47453f;--ink3:#85827a;--ink4:#b3b0a7;
  --line:#e8e5de;--line2:#dcd8cf;--acc:#f15b41;--acc2:#d9482f;--acc-soft:#fdeee9;--ok:#1b8f54;
  --serif:"Fraunces",Georgia,serif;
  /* The Ask page phone treatment (full bleed, one screen) is kept; it reads
     these six tokens and nothing else, so the section re-points them at paper. */
  --ask-bg:#faf9f6;--ask-2:#f3f1ec;--ask-3:#e8e5de;--ask-ink:#1b1a17;--ask-mut:#85827a;--ask-line:#e8e5de;
  display:none;margin:0;padding:0;overflow:hidden;background:var(--paper);color:var(--ink)}
.rlx.rl-ai.active{display:grid;grid-template-columns:236px minmax(0,1fr);
  height:calc(100vh - 68px - var(--rl-banner-h,0px));height:calc(100dvh - 68px - var(--rl-banner-h,0px))}
/* A section owns the area under the top bar and scrolls inside itself. */
.content:has(> .rl-ai.active){padding:0!important;overflow:hidden}
.rl-ai b{font-variant-numeric:tabular-nums}

/* ═══ the inner sidebar ════════════════════════════════════════════════════
   The section's own navigation — the shape every user of AI software already
   carries in their head. New agents, new skills, new goals land in a list that
   already exists, so nothing has to be redesigned to make room. */
.rl-ai .ai-side{display:flex;flex-direction:column;min-height:0;padding:14px 10px 10px;background:var(--paper2);border-right:1px solid var(--line);overflow-y:auto}
.rl-ai .ai-newchat{display:flex;align-items:center;gap:9px;flex:none;height:38px;margin:0 0 12px;padding:0 12px;border-radius:11px;font-size:13px;font-weight:700;color:var(--ink);background:#fff;box-shadow:0 1px 2px rgba(27,26,23,.05),inset 0 0 0 1px var(--line2)}
.rl-ai .ai-newchat:hover{box-shadow:0 1px 2px rgba(27,26,23,.05),inset 0 0 0 1px #c9c4b9}
.rl-ai .ai-newchat .rl-ic{color:var(--acc)}
.rl-ai .ai-nav{display:flex;flex-direction:column;gap:1px;flex:none}
.rl-ai .ai-nav a{display:flex;align-items:center;gap:10px;height:34px;padding:0 10px;border-radius:9px;font-size:13px;font-weight:600;color:var(--ink2);cursor:pointer;transition:background .12s}
.rl-ai .ai-nav a .rl-ic{color:var(--ink3)}
.rl-ai .ai-nav a:hover{background:rgba(27,26,23,.05)}
.rl-ai .ai-nav a.is-on{background:#fff;color:var(--ink);box-shadow:0 1px 2px rgba(27,26,23,.06),inset 0 0 0 1px var(--line)}
.rl-ai .ai-nav a.is-on .rl-ic{color:var(--acc)}
.rl-ai .ai-nav .n{margin-left:auto;min-width:18px;height:18px;padding:0 5px;border-radius:9px;display:grid;place-items:center;font-size:10.5px;font-weight:700;color:#fff;background:var(--acc)}
.rl-ai .ai-lbl{flex:none;padding:16px 10px 5px;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--ink4)}
.rl-ai .ai-goals,.rl-ai .ai-chats{flex:none}
.rl-ai .ai-none{padding:4px 10px 2px;font-size:12px;color:var(--ink4)}
.rl-ai .ai-side .grow{flex:1;min-height:14px}
.rl-ai .ai-foot{flex:none;display:flex;flex-direction:column;gap:1px;padding-top:10px;border-top:1px solid var(--line)}
.rl-ai .ai-foot a{display:flex;align-items:center;gap:9px;height:30px;padding:0 10px;border-radius:8px;font-size:12px;color:var(--ink3);cursor:pointer}
.rl-ai .ai-foot a:hover{background:rgba(27,26,23,.05);color:var(--ink2)}
.rl-ai .ai-online{flex:none;display:flex;align-items:center;gap:7px;padding:9px 10px 2px;font-size:11px;font-weight:600;color:var(--ok)}
.rl-ai .ai-online i{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.rl-ai .ai-online.is-off{color:var(--ink3)}

/* One row shape for a goal and a chat alike: they are both threads. */
.rl-ai .ai-thread,.rl-ai .ai-chats .it{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:9px;font-size:12.5px;color:var(--ink2);cursor:pointer;line-height:1.35}
.rl-ai .ai-thread span,.rl-ai .ai-chats .it .tx{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rl-ai .ai-thread:hover,.rl-ai .ai-chats .it:hover{background:rgba(27,26,23,.05);color:var(--ink)}
.rl-ai .ai-chats .it.on{background:rgba(27,26,23,.07);color:var(--ink);font-weight:600}
.rl-ai .ai-chats .grp{padding:12px 10px 4px;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--ink4)}
.rl-ai .ai-chats > div:first-child .grp{padding-top:0}
.rl-ai .ai-chats .tag{flex:none;font-size:9.5px;font-weight:700;letter-spacing:.08em;color:var(--acc);background:none;padding:0}
.rl-ai .ai-chats .del{flex:none;width:18px;height:18px;border-radius:5px;display:grid;place-items:center;font-size:14px;line-height:1;color:var(--ink4);opacity:0;background:none}
.rl-ai .ai-chats .it:hover .del{opacity:1}
.rl-ai .ai-chats .del:hover{color:var(--ink);background:rgba(27,26,23,.08)}
.rl-ai .ai-chats .askp-hist-empty{padding:2px 10px;font-size:12px;color:var(--ink4)}

/* ═══ main ═════════════════════════════════════════════════════════════════ */
.rl-ai .ai-main{min-width:0;display:flex;flex-direction:column;overflow:hidden}
.rl-ai .askp-main{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--paper)}
/* Empty: the whole column scrolls, so the greeting, the box and everything
   under it move together. Chatting: the thread scrolls, the box stays put. */
.rl-ai .askp-main:not(.chatting){justify-content:flex-start;overflow-y:auto}
.rl-ai .askp-main:not(.chatting) .askp-thread{flex:none;margin-top:0;overflow:visible;padding-bottom:0}
.rl-ai .askp-main:not(.chatting) .askp-composer{margin-bottom:0;animation:none}
.rl-ai .askp-main.chatting{overflow:hidden}
.rl-ai .askp-main.chatting .askp-thread{flex:1;min-height:0;overflow-y:auto}
.rl-ai .askp-main.chatting .askp-thread{padding-top:24px;padding-bottom:8px}

/* the strip over a conversation */
.rl-ai .ai-thead{flex:none;display:flex;align-items:center;gap:10px;padding:11px 22px;border-bottom:1px solid var(--line);background:var(--paper)}
.rl-ai .ai-thead .mark{display:none}
.rl-ai .ai-thead .ti{font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46ch}
.rl-ai .ai-thead .ws{font-size:12px;color:var(--ink4);white-space:nowrap}
.rl-ai .ai-thead .ws::before{content:"·";margin-right:9px}
.rl-ai .ai-thead .sp{flex:1}
.rl-ai .ai-hist{display:none}
.rl-ai .ai-briefbtn{display:inline-flex;align-items:center;gap:7px;flex:none;height:30px;padding:0 12px;border-radius:999px;font-size:12.5px;font-weight:600;color:var(--ink2);background:#fff;box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .ai-briefbtn:hover{color:var(--ink);box-shadow:inset 0 0 0 1px #c9c4b9}
.rl-ai .ai-briefbtn[hidden]{display:none}
.rl-ai .ai-cred{display:inline-flex;align-items:center;gap:6px;flex:none;height:30px;padding:0 11px;border-radius:999px;font-size:12px;font-weight:600;color:var(--ink3);box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-cred:empty{display:none}

/* ── the greeting ───────────────────────────────────────────────────────── */
.rl-ai .askp-thread{padding:0 26px;gap:22px}
.rl-ai .askp-main:not(.chatting) .askp-thread{padding-top:52px}
.rl-ai .askp-hero{text-align:center;max-width:640px;margin:0 auto}
.rl-ai .askp-hero-mark{display:none}
.rl-ai .askp-hero-h{font-family:var(--serif);font-size:32px;font-weight:500;letter-spacing:-.025em;line-height:1.2;color:var(--ink);margin:0}
/* ── the composer ───────────────────────────────────────────────────────── */
.rl-ai .askp-composer{flex:none;padding:22px 26px 26px}
.rl-ai .askp-main.chatting .askp-composer{padding:14px 26px 20px;border-top:1px solid var(--line)}
.rl-ai .askp-composer > *{max-width:720px}
.rl-ai .askp-cbox{border-radius:20px;background:#fff;box-shadow:0 1px 2px rgba(27,26,23,.05),0 12px 32px -12px rgba(27,26,23,.14),inset 0 0 0 1px var(--line);padding:0;overflow:visible}
.rl-ai .askp-main.chatting .askp-cbox{box-shadow:0 1px 2px rgba(27,26,23,.05),inset 0 0 0 1px var(--line2)}
.rl-ai .askp-cbox:focus-within{box-shadow:0 1px 2px rgba(27,26,23,.05),0 12px 32px -12px rgba(27,26,23,.14),inset 0 0 0 1.5px #c9c4b9}
.rl-ai .askp-in{display:block;width:100%;min-height:54px!important;font-size:15px!important;padding:16px 18px 4px;border:0!important;outline:0;background:none!important;box-shadow:none!important;font:inherit;font-size:15px;line-height:1.55;color:var(--ink)}
.rl-ai .askp-in::placeholder{color:var(--ink4)}
.rl-ai .askp-cbar{display:flex;align-items:center;gap:6px;padding:8px 10px 10px 12px}
.rl-ai .askp-sp{flex:1}
.rl-ai .askp-menuwrap{position:relative;flex:none}
.rl-ai .askp-plus{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:var(--ink2);background:none;box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .askp-plus:hover{color:var(--ink);background:var(--paper2)}
.rl-ai .askp-seg{display:inline-flex;gap:2px;padding:3px;border-radius:12px;background:var(--paper2);box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .askp-segb{display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 12px;border-radius:9px;font-size:12.5px;font-weight:600;color:var(--ink3);background:none;white-space:nowrap}
.rl-ai .askp-segb:hover{color:var(--ink)}
.rl-ai .askp-segb.on{color:var(--ink);background:#fff;box-shadow:0 1px 2px rgba(27,26,23,.1)}
.rl-ai .askp-segb.on svg{color:var(--acc)}
.rl-ai .askp-send{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;color:#fff;background:var(--acc);box-shadow:none}
.rl-ai .askp-send:hover{background:var(--acc2)}
.rl-ai .askp-send:disabled{opacity:.45;cursor:default}

/* what it knows, and what it costs — said plainly under the box */
.rl-ai .askp-note{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:5px 14px;margin:12px auto 0;font-size:12px;color:var(--ink3)}
.rl-ai .askp-cap{display:inline-flex;align-items:center;gap:6px}
.rl-ai .askp-cap svg{color:var(--ink4)}
.rl-ai .askp-note > *:not(:first-child)::before{content:"·";margin-right:14px;color:var(--ink4)}
.rl-ai .askp-feats{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin:16px auto 0}
.rl-ai .askp-feats-k{display:none}
.rl-ai .askp-suggrow{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.rl-ai .askp-sugg button{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 13px;border-radius:999px;font-size:12.5px;font-weight:500;color:var(--ink2);background:#fff;box-shadow:inset 0 0 0 1px var(--line);animation:none}
.rl-ai .askp-sugg button:hover{color:var(--ink);box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .askp-sugg button svg{color:var(--ink4)}

/* the studios, titled for what they are: the skills you use yourself */
.rl-ai .askp-menu{position:absolute;left:0;bottom:42px;z-index:30;width:330px;padding:8px;border-radius:16px;background:#fff;box-shadow:0 20px 44px -14px rgba(27,26,23,.28),inset 0 0 0 1px var(--line)}
.rl-ai .askp-menu-k{padding:6px 10px 8px;font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink4)}
.rl-ai .askp-mi{display:flex;align-items:center;gap:11px;width:100%;padding:9px 10px;border-radius:11px;background:none}
.rl-ai .askp-mi:hover{background:var(--paper2)}
.rl-ai .askp-mi .ic{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:var(--ink2);background:var(--paper2)}
.rl-ai .askp-mi:hover .ic{color:var(--acc);background:var(--acc-soft)}
.rl-ai .askp-mi .tx{min-width:0}
.rl-ai .askp-mi .n{display:block;font-size:13px;font-weight:700;color:var(--ink)}
.rl-ai .askp-mi .d{display:block;margin-top:1px;font-size:11.5px;line-height:1.45;color:var(--ink3)}
.rl-ai .askp-mi.soon{opacity:.55}
.rl-ai .askp-mi .soon-tag{font-size:9.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink4)}

/* ── the conversation ───────────────────────────────────────────────────── */
.rl-ai .askp-thread > .inner{max-width:720px;gap:24px}
.rl-ai .askp-u{display:flex;justify-content:flex-end}
.rl-ai .askp-u span{max-width:80%;padding:11px 15px;border-radius:16px 16px 5px 16px;font-size:14px;line-height:1.55;color:#fff;background:var(--ink)}
.rl-ai .askp-body{font-size:14.5px;line-height:1.7;color:var(--ink2)}
.rl-ai .askp-a b{color:var(--ink)}
.rl-ai .askp-tool{display:inline-flex;align-items:center;gap:7px;margin-bottom:8px;font-size:11.5px;font-weight:600;color:var(--ink3)}
.rl-ai .askp-need{display:flex;align-items:flex-start;gap:10px;margin-top:14px;padding:12px 14px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .askp-need svg{color:var(--acc);flex:none;margin-top:2px}
.rl-ai .askp-need .tx{flex:1;font-size:13.5px;line-height:1.55}
.rl-ai .askp-need-act{flex:none;height:28px;padding:0 11px;border-radius:8px;font-size:12px;font-weight:600;color:#fff;background:var(--ink)}
.rl-ai .askp-err{padding:12px 14px;border-radius:12px;font-size:13.5px;color:#9f2d1c;background:var(--acc-soft)}

/* ── what needs a person, and the goals in flight ───────────────────────── */
.rl-ai .ai-under{margin:0 auto;padding-bottom:36px}
.rl-ai .askp-main.chatting .ai-under{display:none}
.rl-ai .ai-sec{display:flex;align-items:baseline;gap:10px;margin:38px 0 12px}
.rl-ai .ai-sec h3{margin:0;font-size:13px;font-weight:700;color:var(--ink)}
.rl-ai .ai-sec span{font-size:12.5px;color:var(--ink3)}
.rl-ai .ai-sec .sp{flex:1}
.rl-ai .ai-need{display:flex;align-items:center;gap:13px;margin-bottom:8px;padding:14px 16px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-need .ic{flex:none;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;color:var(--acc);background:var(--acc-soft)}
.rl-ai .ai-need .tx{flex:1;min-width:0}
.rl-ai .ai-need .tx b{display:block;font-size:13.5px;font-weight:700;line-height:1.4}
.rl-ai .ai-need .tx span{display:block;margin-top:2px;font-size:12.5px;line-height:1.5;color:var(--ink3)}
.rl-ai .ai-need .acts{flex:none;display:flex;gap:7px}
.rl-ai .ai-empty{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:22px;border-radius:14px;border:1px dashed var(--line2)}
.rl-ai .ai-empty svg{color:var(--ink4)}
.rl-ai .ai-empty b{font-size:13.5px}
.rl-ai .ai-empty span{font-size:12.5px;line-height:1.55;color:var(--ink3)}

/* the two buttons this section uses, in its own language */
.rl-ai .rl-btn{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:10px;font-size:12.5px;font-weight:600;color:var(--ink2);background:#fff;box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .rl-btn:hover{color:var(--ink);box-shadow:inset 0 0 0 1px #c9c4b9}
.rl-ai .rl-btn.is-sm{height:28px;padding:0 11px;font-size:12px;border-radius:8px}
.rl-ai .rl-btn.is-dark{color:#fff;background:var(--ink);box-shadow:none}
.rl-ai .rl-btn.is-dark:hover{background:#000}
.rl-ai .rl-btn.is-ghost{background:none;box-shadow:none;color:var(--ink3)}
.rl-ai .rl-btn.is-ghost:hover{color:var(--ink);background:rgba(27,26,23,.05)}

/* the scrim behind the phone drawer */
.rl-ai .ai-scrim{display:none;position:fixed;inset:0;z-index:60;background:rgba(27,26,23,.35);border:0}

/* ═══ phone ════════════════════════════════════════════════════════════════
   The sidebar becomes the drawer the Ask page already had: one class on the
   page element (askToggleHistory) drives the scrim and the panel together. */
/* Up to 860px the old sheet hides the header here and pins .content to one
   screen above the tab bar (height:100dvh - tab bar, !important), and the
   section fills it (.askp-scope height:100%). The owner's banner sits above
   the section too, so the container gives up its height as well — the same
   selector, later in the cascade (this sheet loads last). */
@media (max-width: 860px){
  body:has(.askp-scope.active) .content{height:calc(100dvh - var(--rl-tabbar-h) - var(--rl-banner-h,0px))!important}
}
@media (max-width: 860px){
  .rlx.rl-ai.active{grid-template-columns:minmax(0,1fr);
    height:calc(100vh - 61px - var(--rl-tabbar-h,59px) - var(--rl-banner-h,0px));height:calc(100dvh - 61px - var(--rl-tabbar-h,59px) - var(--rl-banner-h,0px))}
  .rl-ai .ai-side{position:fixed;top:0;bottom:0;left:0;z-index:61;width:270px;padding-top:16px;
    transform:translateX(-100%);transition:transform .2s var(--rl-ease,ease);box-shadow:0 0 60px rgba(27,26,23,.2)}
  .rl-ai.hist-open .ai-side{transform:none}
  .rl-ai.hist-open .ai-scrim{display:block}
  .rl-ai .ai-hist{display:grid;place-items:center;flex:none;width:32px;height:32px;margin-left:-6px;border-radius:9px;color:var(--ink2)}
  .rl-ai .ai-thead{padding:9px 14px}
  .rl-ai .ai-thead .ws{display:none}
  .rl-ai .ai-cred{display:none}
  .rl-ai .askp-thread{padding:0 16px}
  .rl-ai .askp-main:not(.chatting) .askp-thread{padding-top:30px}
  .rl-ai .askp-hero-h{font-size:25px}
  .rl-ai .askp-composer{padding:16px 16px 20px}
  .rl-ai .askp-main.chatting .askp-composer{padding:12px 16px 16px}
  .rl-ai .askp-segb{padding:0 9px;font-size:12px}
  .rl-ai .askp-menu{width:calc(100vw - 52px);max-width:330px}
  .rl-ai .askp-note{justify-content:flex-start;font-size:11.5px}
  .rl-ai .ai-need{flex-wrap:wrap}
  .rl-ai .ai-need .acts{margin-left:47px;flex:1 1 100%;max-width:calc(100% - 47px)}
}

/* `hidden` must win over any display a component sets, or an empty badge
   shows as a dot on every nav row. */
.rl-ai [hidden]{display:none!important}
/* The old composer wore the accent as a 2px border; here the box is the paper
   surface and only the focus ring moves. */
.rl-ai .askp-cbox,.rl-ai .askp-cbox:focus-within{border:0!important}
.rl-ai .askp-in:focus{border:0!important;box-shadow:none!important}

/* The empty separator a missing credit price used to leave behind. */
.rl-ai .askp-note > *:empty{display:none}

/* ── the phone, over the Ask page's own phone rules ─────────────────────────
   Those rules were written for a screen that was only ever a conversation, so
   they pin the thread and let it scroll alone. Home has a greeting, a box and
   a queue under it that must move together, and they carry !important — which
   is the only reason these do. */
@media (max-width: 860px){
  .rl-ai .askp-main:not(.chatting){overflow-y:auto!important}
  .rl-ai .askp-main:not(.chatting) .askp-thread{flex:none!important;height:auto!important;overflow:visible!important}
  .rl-ai .askp-main:not(.chatting) .askp-composer{flex:none!important}
  /* Which voice you are in is worth a word; the one you are not is its icon. */
  .rl-ai .askp-segb span{display:none!important}
  .rl-ai .askp-segb.on span{display:inline!important}
  /* Starters wrap here rather than scrolling sideways: a chip half off the
     screen edge reads as a rendering fault, not as an invitation to swipe. */
  .rl-ai .askp-suggrow{flex-wrap:wrap!important;justify-content:flex-start!important;
    margin:0!important;padding:0!important;overflow:visible!important}
  .rl-ai .askp-feats{justify-content:flex-start;margin-top:14px}
  .rl-ai .askp-sugg button{white-space:normal;text-align:left}
}

/* The starters are a row inside a row; without this the inner one sizes to its
   content and runs off the screen instead of wrapping inside its parent. */
.rl-ai .askp-suggrow{flex:1 1 100%;min-width:0;width:100%}
.rl-ai .askp-sugg button{flex:0 1 auto}

/* ═══ views ════════════════════════════════════════════════════════════════
   Hidden, never destroyed: Home holds the open conversation. */
.rl-ai .ai-view{flex:1;min-height:0;display:flex;flex-direction:column}
.rl-ai .ai-view[hidden]{display:none!important}
.rl-ai .ai-view[data-view="agents"]{overflow-y:auto}
.rl-ai .ai-wide{width:100%;max-width:1080px;margin:0 auto;padding:0 32px}
.rl-ai .ai-h1{font-family:var(--serif);font-size:30px;font-weight:500;letter-spacing:-.025em;line-height:1.15;margin:0;color:var(--ink)}
.rl-ai .ai-phead{display:flex;align-items:flex-end;gap:14px;padding:30px 0 0}
.rl-ai .ai-phead .ai-hist{align-self:center;margin-left:-6px}
.rl-ai .ai-detail > .ai-hist{margin:0 0 10px -6px}
.rl-ai .ai-phead p{margin:7px 0 0;font-size:13.5px;line-height:1.6;color:var(--ink3);max-width:62ch}
.rl-ai .ai-phead .sp{flex:1}
.rl-ai .ai-foot-note{margin:22px 0 34px;font-size:12px;line-height:1.6;color:var(--ink4);max-width:70ch}
.rl-ai .ai-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}

/* ── the index: rows, because a roster grows ───────────────────────────────
   The fifteenth agent is one more row. A grid of cards would have to be
   redesigned to hold them. */
.rl-ai .ai-soon{margin:18px 0 40px;padding:14px 16px;border-radius:14px;font-size:12.5px;line-height:1.6;color:var(--ink3);border:1px dashed var(--line2)}
.rl-ai .ai-soon b{display:block;color:var(--ink2);margin-bottom:2px}
.rl-ai .ai-soon i{display:block;margin-top:6px;font-style:normal;color:var(--ink4)}

/* the switch — one shape wherever an agent can be turned on or off */
.rl-ai .ai-sw{flex:none;position:relative;width:38px;height:22px;border-radius:99px;background:var(--ok);transition:background .14s}
.rl-ai .ai-sw::after{content:"";position:absolute;right:2px;top:2px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(27,26,23,.3)}
.rl-ai .ai-sw.off{background:#d5d1c8}
.rl-ai .ai-sw.off::after{right:auto;left:2px}

/* ── an agent ──────────────────────────────────────────────────────────────*/
.rl-ai .ai-detail{padding:18px 0 30px}
.rl-ai .ai-state{display:inline-flex;align-items:center;gap:7px;flex:none;font-size:12px;font-weight:600;color:var(--ok)}
.rl-ai .ai-state i{width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.rl-ai .ai-state.is-off{color:var(--ink3)}
.rl-ai .ai-state.is-wait{color:#a9741f}
.rl-ai .ai-tabs{display:flex;gap:22px;margin:20px 0 0;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.rl-ai .ai-tabs::-webkit-scrollbar{display:none}
.rl-ai .ai-tabs a{flex:none;padding:0 0 11px;font-size:13px;font-weight:600;color:var(--ink3);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.rl-ai .ai-tabs a:hover{color:var(--ink)}
.rl-ai .ai-tabs a.is-on{color:var(--ink);border-bottom-color:var(--ink)}
.rl-ai .ai-sum{margin:22px 0 0;font-family:var(--serif);font-size:20px;line-height:1.45;font-weight:400;letter-spacing:-.012em;color:var(--ink);max-width:40ch}
.rl-ai .ai-kv{margin:18px 0 0;max-width:560px}
.rl-ai .ai-kv div{display:flex;justify-content:space-between;gap:14px;padding:9px 0;font-size:13px;color:var(--ink3);border-bottom:1px solid var(--line)}
.rl-ai .ai-kv b{color:var(--ink);font-weight:600;text-align:right}
.rl-ai .ai-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
.rl-ai .ai-chip{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 12px;border-radius:999px;font-size:12.5px;color:var(--ink2);background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-chip .rl-ic{color:var(--ink4)}
.rl-ai button.ai-chip:hover{color:var(--ink);box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .ai-chip.is-off{color:var(--ink4);background:none}
.rl-ai .ai-chip i{font-style:normal;font-size:11px;color:var(--ink4)}
.rl-ai .ai-chip i::before{content:"·";margin-right:7px}
.rl-ai .ai-act{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.rl-ai .ai-act .tm{flex:none;width:56px;font-size:11.5px;color:var(--ink4);padding-top:2px}
.rl-ai .ai-act > div{flex:1;min-width:0}
.rl-ai .ai-act b{display:block;font-size:13px;font-weight:600;line-height:1.45}
.rl-ai .ai-act span{display:block;margin-top:2px;font-size:12.5px;line-height:1.55;color:var(--ink3)}

/* ── instructions: a document, and a conversation beside it ────────────────*/
.rl-ai .ai-train{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:22px;margin:22px 0 0;align-items:start}
.rl-ai .ai-doc{border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.rl-ai .ai-doc-h{display:flex;align-items:center;gap:10px;padding:11px 14px;border-bottom:1px solid var(--line);font-size:12px;color:var(--ink3)}
.rl-ai .ai-doc-h b{color:var(--ink);font-weight:700;flex:none}
.rl-ai .ai-doc-h .sp{flex:1}
.rl-ai .ai-doc-h > span:not(.sp){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* The old sheet styles bare input/textarea/select with !important, including
   a 42px min-height that flattens a document into a one-line box. This answers
   in kind, and only for the properties it contests. */
.rl-ai textarea.ai-doc-b{display:block;width:100%;min-height:340px!important;font-size:14px!important;padding:18px 20px;border:0!important;outline:0;resize:vertical;
  font:inherit;font-size:14px;line-height:1.75;color:var(--ink2);background:none!important;box-shadow:none!important}
.rl-ai textarea.ai-doc-b::placeholder{color:var(--ink4)}
.rl-ai .ai-starts{padding:0 16px 16px}
.rl-ai .ai-test{display:flex;flex-direction:column;border-radius:16px;background:var(--paper2);box-shadow:inset 0 0 0 1px var(--line);overflow:hidden;min-height:430px}
.rl-ai .ai-test-h{display:flex;align-items:center;gap:9px;flex:none;padding:11px 14px;border-bottom:1px solid var(--line);font-size:12px;color:var(--ink3)}
.rl-ai .ai-test-h b{color:var(--ink);flex:none}
.rl-ai .ai-test-h .sp{flex:1}
.rl-ai .ai-test-b{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:9px;padding:16px}
.rl-ai .ai-test-empty{margin:auto;max-width:34ch;text-align:center;color:var(--ink3)}
.rl-ai .ai-test-empty svg{color:var(--ink4);margin:0 auto 8px}
.rl-ai .ai-test-empty b{display:block;font-size:13.5px;color:var(--ink2)}
.rl-ai .ai-test-empty span{display:block;margin-top:4px;font-size:12.5px;line-height:1.6}
.rl-ai .ai-bub{max-width:86%;padding:10px 13px;border-radius:14px;font-size:13px;line-height:1.6;white-space:pre-wrap}
.rl-ai .ai-bub.cu{align-self:flex-end;color:#fff;background:var(--ink);border-bottom-right-radius:5px}
.rl-ai .ai-bub.ag{align-self:flex-start;background:#fff;box-shadow:inset 0 0 0 1px var(--line);border-bottom-left-radius:5px;color:var(--ink2)}
.rl-ai .ai-used{align-self:flex-start;display:flex;align-items:center;gap:7px;padding:0 2px;font-size:11.5px;line-height:1.5;color:var(--ink3)}
.rl-ai .ai-used b{color:var(--ink2);font-weight:600}
.rl-ai .ai-used .rl-ic{flex:none;color:var(--acc)}
.rl-ai .ai-test-in{display:flex;align-items:center;gap:8px;flex:none;margin:0 12px 12px;padding:5px 5px 5px 14px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-test-in input{flex:1;min-width:0;min-height:0!important;font-size:13px!important;border:0!important;outline:0;background:none!important;box-shadow:none!important;font:inherit;font-size:13px;color:var(--ink)}
.rl-ai .ai-test-in input::placeholder{color:var(--ink4)}

/* ── skills, as cards with a sentence ──────────────────────────────────────*/
.rl-ai .ai-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:20px 0 0}
.rl-ai .ai-skill{display:flex;flex-direction:column;padding:16px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-skill .top{display:flex;align-items:center;gap:11px}
.rl-ai .ai-skill .ic{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;color:var(--acc);background:var(--acc-soft)}
.rl-ai .ai-skill.is-off .ic{color:var(--ink3);background:var(--paper2)}
.rl-ai .ai-skill .top b{flex:1;min-width:0;font-size:14px;font-weight:700;letter-spacing:-.01em}
.rl-ai .ai-skill .kind{margin-left:auto;flex:none;white-space:nowrap;text-align:right;font-size:10px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--ok)}
.rl-ai .ai-skill.is-off .kind{color:var(--ink4)}
.rl-ai .ai-skill p{margin:12px 0 0;font-size:12.5px;line-height:1.6;color:var(--ink3)}
.rl-ai .ai-skill p em{font-style:normal;color:var(--ink2);font-weight:600}

/* ── authority: the money rules, rendered where they belong ────────────────*/
.rl-ai .ai-form{display:flex;flex-direction:column;gap:20px}
.rl-ai .ai-fld label{display:block;font-size:12.5px;font-weight:700;margin-bottom:7px;color:var(--ink)}
.rl-ai .ai-fld label span{display:block;margin-top:2px;font-weight:500;font-size:12px;line-height:1.5;color:var(--ink3)}
.rl-ai .ai-rows2{display:flex;flex-direction:column;gap:7px;margin-bottom:9px}
.rl-ai .ai-orow{display:grid;grid-template-columns:minmax(0,1.3fr) 92px minmax(0,1.6fr) 30px;gap:7px;align-items:center}
.rl-ai .ai-orow.is-one{grid-template-columns:minmax(0,1fr) 30px}
.rl-ai .ai-orow input,.rl-ai input.ai-in{min-width:0;min-height:0!important;font-size:13px!important;padding:10px 12px;border:0!important;border-radius:11px;background:#fff!important;
  box-shadow:inset 0 0 0 1px var(--line2)!important;font:inherit;font-size:13px;color:var(--ink);outline:0}
.rl-ai .ai-orow input:focus,.rl-ai input.ai-in:focus{box-shadow:inset 0 0 0 1.5px #c9c4b9!important}
.rl-ai .ai-orow input::placeholder,.rl-ai input.ai-in::placeholder{color:var(--ink4)}
.rl-ai .ai-x{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:var(--ink4)}
.rl-ai .ai-x:hover{color:var(--ink);background:rgba(27,26,23,.06)}
.rl-ai .ai-card{padding:18px 20px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);margin-bottom:14px}
.rl-ai .ai-card .k{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink4)}
.rl-ai .ai-card p{margin:8px 0 0;font-size:13px;line-height:1.6;color:var(--ink3)}
.rl-ai .ai-card p.ai-never{color:var(--ink2)}
.rl-ai .ai-ceiling{display:flex;align-items:baseline;gap:4px;margin-top:6px}
.rl-ai .ai-ceiling input{width:120px;min-height:0!important;font-size:52px!important;padding:0!important;border:0!important;background:none!important;box-shadow:none!important;outline:0;
  font-family:var(--serif);font-size:52px;font-weight:500;letter-spacing:-.04em;line-height:1.05;color:var(--ink)}
.rl-ai .ai-ceiling span{font-family:var(--serif);font-size:34px;font-weight:500;color:var(--ink3)}
.rl-ai .ai-sub{display:block;margin:16px 0 7px;font-size:12.5px;font-weight:700;color:var(--ink)}
.rl-ai .ai-sub span{display:block;margin-top:2px;font-weight:500;font-size:12px;color:var(--ink3)}
.rl-ai input.ai-in{display:block;width:100%}
.rl-ai .rl-btn[disabled]{opacity:.45;cursor:default}

/* ═══ the agents views on a narrow screen ══════════════════════════════════*/
@media (max-width: 1040px){
  .rl-ai .ai-train{grid-template-columns:minmax(0,1fr)}
  .rl-ai .ai-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 860px){
  .rl-ai .ai-wide{padding:0 16px}
  .rl-ai .ai-phead{padding-top:20px}
  .rl-ai .ai-h1{font-size:25px}
  .rl-ai .ai-grid{grid-template-columns:minmax(0,1fr)}
  .rl-ai .ai-detail{padding:14px 0 24px}
  .rl-ai .ai-sum{font-size:18px}
  .rl-ai .ai-orow{grid-template-columns:minmax(0,1fr) 30px}
  .rl-ai .ai-test{min-height:360px}
}

/* ═══ the skills library ═══════════════════════════════════════════════════
   One list, two doors: the skills an agent picks mid-conversation and the
   ones you press yourself wear the same card, because a custom skill later is
   one more of them. */
.rl-ai .ai-view[data-view="skills"]{overflow-y:auto}
.rl-ai .ai-filter{display:flex;flex-wrap:wrap;gap:6px;margin:22px 0 4px}
.rl-ai .ai-filter a{display:inline-flex;align-items:center;gap:7px;height:30px;padding:0 13px;border-radius:999px;font-size:12.5px;font-weight:600;color:var(--ink3);cursor:pointer}
.rl-ai .ai-filter a:hover{color:var(--ink)}
.rl-ai .ai-filter a.is-on{color:var(--ink);background:#fff;box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .ai-filter a i{font-style:normal;font-weight:600;color:var(--ink4)}
.rl-ai .ai-skill .ft{display:flex;align-items:center;gap:6px;margin-top:auto;padding-top:14px;min-height:36px}
.rl-ai .ai-skill .ft .sp{flex:1}
.rl-ai .ai-skill .ft small{font-size:11.5px;line-height:1.45;color:var(--ink4)}
.rl-ai .ai-ready{display:inline-flex;align-items:center;gap:6px;flex:none;font-size:11.5px;font-weight:600;color:var(--ok)}
.rl-ai .ai-wait{flex:none;font-size:11.5px;color:var(--ink4)}


@media (max-width: 860px){
  .rl-ai .ai-filter{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-16px;padding-right:16px}
  .rl-ai .ai-filter::-webkit-scrollbar{display:none}
  .rl-ai .ai-filter a{flex:none}
}

/* ═══ instructions: the whole of the old House rules screen ════════════════
   Written by Reachly, edited by you, read by the agent — three kinds of text
   on one page, and the design's job is to keep them apart. */
.rl-ai .ai-how{margin:0 0 16px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.rl-ai .ai-how .t{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--line);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink2)}
.rl-ai .ai-how .t span{font-size:11px;font-weight:500;letter-spacing:0;text-transform:none;color:var(--ink4)}
.rl-ai .ai-how .r{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:14px;align-items:baseline;padding:12px 16px;border-bottom:1px solid var(--line)}
.rl-ai .ai-how .r:last-child{border-bottom:0}
.rl-ai .ai-how .k{font-size:12.5px;color:var(--ink3)}
.rl-ai .ai-how .v{font-size:13.5px;line-height:1.6;color:var(--ink)}
.rl-ai .ai-how .v small{color:var(--ink4);font-size:12px}
.rl-ai .ai-how .v i{font-style:normal;color:var(--ink4)}
.rl-ai .ai-winsel{min-height:0!important;font-size:13.5px!important;padding:7px 10px;border:0!important;border-radius:9px;
  background:var(--paper2)!important;box-shadow:inset 0 0 0 1px var(--line2)!important;color:var(--ink);outline:0}

/* the three numbered sections of the document */
.rl-ai .ai-dsec{border-bottom:1px solid var(--line)}
.rl-ai .ai-dsec:last-of-type{border-bottom:0}
.rl-ai .ai-dsec .h{display:flex;align-items:center;gap:11px;padding:13px 16px;font-size:13.5px;color:var(--ink)}
.rl-ai .ai-dsec .h b{font-weight:700}
.rl-ai .ai-dsec .h .n{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:var(--ink3);box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .ai-dsec .h .sum{margin-left:auto;font-size:12px;color:var(--ink4)}
.rl-ai .ai-dsec .h .rl-ic{color:var(--ink4);transition:transform .15s}
.rl-ai .ai-dsec.is-open .h .rl-ic{transform:rotate(180deg)}
.rl-ai .ai-dsec .h[data-act]{cursor:pointer}
.rl-ai .ai-dsec .h[data-act]:hover{background:rgba(27,26,23,.025)}
.rl-ai .ai-dsec .b{padding:0 16px 18px}
.rl-ai .ai-lead{margin:0 0 12px;font-size:12.5px;line-height:1.6;color:var(--ink3);max-width:64ch}

/* rules are a LIST — one sentence per line, added and removed one at a time */
.rl-ai .ai-rules{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.rl-ai .ai-rule{display:flex;align-items:flex-start;gap:10px;padding:10px 10px 10px 13px;border-radius:11px;background:var(--paper2);font-size:13px;line-height:1.55}
.rl-ai .ai-rule span{flex:1;min-width:0}
.rl-ai .ai-rule i{display:block;margin-top:2px;font-style:normal;font-size:11px;color:var(--ink4)}
.rl-ai .ai-rule.is-learned{background:none;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-addrow{display:flex;gap:7px}
.rl-ai .ai-addrow input{flex:1;min-width:0;min-height:0!important;font-size:13px!important;padding:10px 13px;border:0!important;border-radius:11px;
  background:#fff!important;box-shadow:inset 0 0 0 1px var(--line2)!important;color:var(--ink);outline:0}
.rl-ai .ai-addrow input:focus{box-shadow:inset 0 0 0 1.5px #c9c4b9!important}
.rl-ai .ai-addrow input::placeholder{color:var(--ink4)}
.rl-ai .ai-startk{align-self:center;font-size:11.5px;color:var(--ink4);margin-right:2px}
.rl-ai .ai-starts{margin-top:12px}
.rl-ai .ai-dlabel2{margin:18px 0 8px;font-size:12.5px;font-weight:700;color:var(--ink)}
.rl-ai .ai-empty.is-flat{flex-direction:row;align-items:center;gap:8px;padding:14px;margin-bottom:10px}

/* tick lists: hand-off situations, what to capture, what makes a lead hot */
.rl-ai .ai-ticks{display:flex;flex-wrap:wrap;gap:7px}
.rl-ai .ai-tick{display:inline-flex;align-items:center;gap:9px;padding:9px 13px 9px 10px;border-radius:11px;font-size:12.5px;line-height:1.4;
  color:var(--ink2);background:#fff;box-shadow:inset 0 0 0 1px var(--line);text-align:left}
.rl-ai .ai-tick:hover{box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .ai-tick .bx{flex:none;width:17px;height:17px;border-radius:5px;display:grid;place-items:center;color:#fff;box-shadow:inset 0 0 0 1.5px var(--line2)}
.rl-ai .ai-tick.is-on{color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.rl-ai .ai-tick.is-on .bx{background:var(--ink);box-shadow:none}

/* the two modes Qualify can run in */
.rl-ai .ai-modes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0 0 16px}
.rl-ai .ai-mode-b{display:flex;align-items:flex-start;gap:11px;padding:13px 15px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);text-align:left}
.rl-ai .ai-mode-b .bx{flex:none;width:18px;height:18px;margin-top:1px;border-radius:50%;display:grid;place-items:center;color:#fff;box-shadow:inset 0 0 0 1.5px var(--line2)}
.rl-ai .ai-mode-b.is-on{box-shadow:inset 0 0 0 1.5px var(--ink)}
.rl-ai .ai-mode-b.is-on .bx{background:var(--ink);box-shadow:none}
.rl-ai .ai-mode-b b{display:block;font-size:13px;font-weight:700}
.rl-ai .ai-mode-b small{display:block;margin-top:2px;font-size:11.5px;line-height:1.5;color:var(--ink3)}

/* rules the agent proposed from real conversations */
.rl-ai .ai-sug{display:flex;flex-direction:column;gap:8px}
.rl-ai .ai-sug .row{display:flex;align-items:flex-start;gap:14px;padding:13px 15px;border-radius:13px;background:var(--acc-soft)}
.rl-ai .ai-sug .row > div:first-child{flex:1;min-width:0}
.rl-ai .ai-sug .m{font-size:11px;font-weight:600;color:var(--acc)}
.rl-ai .ai-sug .t{margin-top:4px;font-size:13px;line-height:1.55;color:var(--ink)}
.rl-ai .ai-sug .w{margin-top:4px;font-size:11.5px;line-height:1.5;color:var(--ink3)}
.rl-ai .ai-sug .act{flex:none;display:flex;gap:7px}

/* what the agent actually reads */
.rl-ai .ai-review{display:flex;flex-direction:column;gap:2px}
.rl-ai .ai-review .s{display:grid;grid-template-columns:170px minmax(0,1fr);gap:14px;padding:11px 0;border-bottom:1px solid var(--line)}
.rl-ai .ai-review .s:last-child{border-bottom:0}
.rl-ai .ai-review .k{font-size:12.5px;font-weight:700;color:var(--ink)}
.rl-ai .ai-review .k small{display:block;margin-top:1px;font-weight:500;font-size:11px;color:var(--ink4)}
.rl-ai .ai-review .v{font-size:13px;line-height:1.7;color:var(--ink2)}
.rl-ai .ai-review .v.is-empty{color:var(--ink4)}

/* saving is a version */
.rl-ai .ai-save{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:13px 16px;border-top:1px solid var(--line);background:var(--paper2)}
.rl-ai .ai-save .st{font-size:12px;color:var(--ink3)}
.rl-ai .ai-save .st b{color:var(--ink);font-weight:700}
.rl-ai .ai-save .sp{flex:1}
.rl-ai textarea.ai-doc-b.is-short{min-height:76px!important;padding:12px 13px;margin-top:10px;border-radius:11px;
  background:#fff!important;box-shadow:inset 0 0 0 1px var(--line2)!important;font-size:13px!important;line-height:1.6}
@media (max-width: 860px){
  .rl-ai .ai-how .r{grid-template-columns:minmax(0,1fr);gap:4px}
  .rl-ai .ai-how .a{margin-top:4px}
  .rl-ai .ai-modes{grid-template-columns:minmax(0,1fr)}
  .rl-ai .ai-review .s{grid-template-columns:minmax(0,1fr);gap:4px}
  .rl-ai .ai-sug .row{flex-direction:column;gap:10px}
  .rl-ai .ai-dsec .b{padding:0 13px 16px}
  .rl-ai .ai-dsec .h{padding:12px 13px}
  .rl-ai .ai-save{padding:12px 13px}
}

/* ═══ what the numbers say ═════════════════════════════════════════════════
   Measured to date, one engine per agent. Figures as chips, evidence as rows,
   insights as cards that can become a rule. */
.rl-ai .ai-figrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.rl-ai .ai-fig{display:inline-flex;align-items:baseline;gap:6px;height:32px;padding:0 12px;border-radius:999px;font-size:12.5px;color:var(--ink3);background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-fig b{font-size:14px;color:var(--ink)}
.rl-ai .ai-fig.is-good{color:var(--ok);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ok) 30%,transparent)}
.rl-ai .ai-fig.is-good b{color:var(--ok)}
.rl-ai .ai-fig.is-warn{color:#a9741f;box-shadow:inset 0 0 0 1px #ead9b5}
.rl-ai .ai-fig.is-warn b{color:#a9741f}
.rl-ai .ai-irows{display:flex;flex-direction:column}
.rl-ai .ai-irow{display:grid;grid-template-columns:150px 74px minmax(0,1fr);gap:12px;padding:8px 0;border-bottom:1px solid var(--line);font-size:12.5px}
.rl-ai .ai-irow .nm{font-weight:600;color:var(--ink);text-transform:capitalize}
.rl-ai .ai-irow .ct{color:var(--ink3)}
.rl-ai .ai-irow .sp{color:var(--ink3)}
.rl-ai .ai-inss{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.rl-ai .ai-ins{padding:13px 15px;border-radius:13px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);border-left:3px solid var(--ink4)}
.rl-ai .ai-ins.is-good{border-left-color:var(--ok)}
.rl-ai .ai-ins.is-warn{border-left-color:var(--acc)}
.rl-ai .ai-ins b{display:block;font-size:13px;font-weight:700}
.rl-ai .ai-ins p{margin:4px 0 0;font-size:12.5px;line-height:1.6;color:var(--ink3)}
.rl-ai .ai-ins .rl-btn{margin-top:10px}

/* ═══ when it may speak first ══════════════════════════════════════════════
   One shape for four behaviours: a switch, what it does, and the guards. */
.rl-ai .ai-speak{margin-bottom:8px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.rl-ai .ai-speak.is-on{box-shadow:inset 0 0 0 1.5px var(--ink)}
.rl-ai .ai-speak .hd{display:flex;align-items:flex-start;gap:14px;padding:13px 15px}
.rl-ai .ai-speak .hd > div{flex:1;min-width:0}
.rl-ai .ai-speak .hd b{display:block;font-size:13.5px;font-weight:700}
.rl-ai .ai-speak .hd span{display:block;margin-top:3px;font-size:12.5px;line-height:1.55;color:var(--ink3)}
.rl-ai .ai-speak .hd .ai-sw{margin-top:2px}
.rl-ai .ai-speak-b{padding:2px 15px 15px;border-top:1px solid var(--line)}
.rl-ai .ai-speak-b .ai-sub{margin-top:12px}
.rl-ai .ai-bands{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:7px;margin-top:12px}
.rl-ai .ai-bands .ai-ck{width:100%;cursor:pointer;text-align:left}
.rl-ai .ai-nums{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.rl-ai .ai-nums label{display:flex;align-items:center;gap:8px;flex:1 1 200px;padding:8px 8px 8px 12px;border-radius:11px;background:var(--paper2);font-size:12.5px;color:var(--ink2)}
.rl-ai .ai-nums label span{flex:1;min-width:0}
.rl-ai .ai-nums label i{font-style:normal;font-size:11.5px;color:var(--ink4)}
.rl-ai .ai-nums input{width:66px;min-height:0!important;font-size:13px!important;padding:6px 8px;border:0!important;border-radius:8px;
  background:#fff!important;box-shadow:inset 0 0 0 1px var(--line2)!important;color:var(--ink);outline:0;text-align:right}
.rl-ai select.ai-in{display:block;width:100%;min-height:0!important;font-size:13px!important;padding:10px 12px;border:0!important;border-radius:11px;
  background:#fff!important;box-shadow:inset 0 0 0 1px var(--line2)!important;color:var(--ink);outline:0}
.rl-ai .ai-ck{display:flex;align-items:flex-start;gap:11px;padding:11px 13px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-ck.is-on{box-shadow:inset 0 0 0 1.5px var(--ink)}
.rl-ai .ai-ck .bx{flex:none;width:18px;height:18px;margin-top:1px;border-radius:6px;display:grid;place-items:center;color:#fff;box-shadow:inset 0 0 0 1.5px var(--line2)}
.rl-ai .ai-ck.is-on .bx{background:var(--ink);box-shadow:none}
.rl-ai .ai-ck b{display:block;font-size:13px;font-weight:600}
.rl-ai .ai-ck small{display:block;margin-top:1px;font-size:11.5px;line-height:1.45;color:var(--ink3)}

/* ═══ performance by version ═══════════════════════════════════════════════*/
.rl-ai .ai-verdict{display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:14px 16px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-verdict .vi{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:var(--ok);background:color-mix(in srgb,var(--ok) 10%,#fff)}
.rl-ai .ai-verdict.is-down .vi{color:var(--acc);background:var(--acc-soft)}
.rl-ai .ai-verdict b{display:block;font-size:13.5px}
.rl-ai .ai-verdict p{margin:3px 0 0;font-size:12.5px;line-height:1.55;color:var(--ink3)}
.rl-ai .ai-tblwrap{margin-top:14px;overflow-x:auto;border-radius:14px;box-shadow:inset 0 0 0 1px var(--line);background:#fff}
.rl-ai .ai-tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.rl-ai .ai-tbl th{padding:10px 12px;text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--ink4);border-bottom:1px solid var(--line);white-space:nowrap}
.rl-ai .ai-tbl td{padding:10px 12px;border-bottom:1px solid var(--line);white-space:nowrap;color:var(--ink2)}
.rl-ai .ai-tbl tr:last-child td{border-bottom:0}
.rl-ai .ai-tbl td.dim{color:var(--ink4)}
.rl-ai .ai-pill{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--acc);background:var(--acc-soft)}
.rl-ai .ai-pill.is-dim{color:var(--ink4);background:var(--paper2)}

@media (max-width: 860px){
  .rl-ai .ai-irow{grid-template-columns:minmax(0,1fr) 60px;gap:6px}
  .rl-ai .ai-irow .sp{grid-column:1 / -1}
  .rl-ai .ai-bands{grid-template-columns:minmax(0,1fr)}
}

/* ═══ activity: the team report, the learning loop, and the feed ═══════════*/
.rl-ai .ai-view[data-view="activity"]{overflow-y:auto}
.rl-ai .ai-seg{display:inline-flex;gap:2px;padding:3px;border-radius:12px;background:var(--paper2);box-shadow:inset 0 0 0 1px var(--line);align-self:center}
.rl-ai .ai-seg button{height:28px;padding:0 12px;border-radius:9px;font-size:12.5px;font-weight:600;color:var(--ink3);white-space:nowrap}
.rl-ai .ai-seg button.is-on{color:var(--ink);background:#fff;box-shadow:0 1px 2px rgba(27,26,23,.1)}

/* rollup figures carry a delta; intelligence figures never do */
.rl-ai .ai-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.rl-ai .ai-stat{padding:14px 16px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-stat b{display:block;font-size:22px;font-weight:700;letter-spacing:-.03em;line-height:1.1}
.rl-ai .ai-stat span{display:block;margin-top:4px;font-size:11.5px;color:var(--ink3)}
.rl-ai .ai-delta{display:inline-block;margin-top:7px;font-style:normal;font-size:11px;font-weight:700;color:var(--ink4)}
.rl-ai .ai-delta.is-up{color:var(--ok)}
.rl-ai .ai-delta.is-down{color:var(--acc)}
.rl-ai .ai-delta.is-flat{font-weight:500}

/* two small daily series: one accent, the last day marked */
.rl-ai .ai-charts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.rl-ai .ai-chart{padding:12px 14px 10px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-chart .h{display:flex;justify-content:space-between;gap:10px;margin-bottom:8px;font-size:12px;color:var(--ink3)}
.rl-ai .ai-chart .h b{color:var(--ink);font-weight:700}
.rl-ai .ai-chart svg{display:block;width:100%;height:54px}
.rl-ai .ai-chart rect{fill:var(--line2)}
.rl-ai .ai-chart rect.is-last{fill:var(--acc)}
.rl-ai .ai-chart .x{display:flex;justify-content:space-between;margin-top:5px;font-size:10.5px;color:var(--ink4)}

/* per agent, one row each, opening the agent */
.rl-ai .ai-trows{display:flex;flex-direction:column}
.rl-ai .ai-trow{display:grid;grid-template-columns:32px minmax(0,1.4fr) repeat(4,minmax(0,1fr)) 20px;align-items:center;gap:12px;padding:12px 6px;border-bottom:1px solid var(--line)}
.rl-ai .ai-trow[data-agent]{cursor:pointer}
.rl-ai .ai-trow[data-agent]:hover{background:rgba(27,26,23,.025)}
.rl-ai .ai-trow .av{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:var(--acc);background:var(--acc-soft)}
.rl-ai .ai-trow .t b{display:block;font-size:13.5px;font-weight:700}
.rl-ai .ai-trow .t span{display:block;font-size:11px;color:var(--ink4);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rl-ai .ai-trow .c b{display:block;font-size:14px;font-weight:700}
.rl-ai .ai-trow .c span{display:block;font-size:10.5px;color:var(--ink4)}
.rl-ai .ai-trow .c .ai-delta{margin-top:2px}
.rl-ai .ai-trow .go{color:var(--ink4);transform:rotate(-90deg)}

/* the learning loop's test rows */
.rl-ai .ai-test-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 14px;border-radius:12px;background:var(--paper2)}
.rl-ai .ai-test-row b{font-size:13px}
.rl-ai .ai-test-row span{flex:1 1 240px;font-size:12px;line-height:1.5;color:var(--ink3)}
.rl-ai .ai-test-row.is-live{background:color-mix(in srgb,var(--ok) 8%,#fff)}
.rl-ai .ai-irow.is-two{grid-template-columns:200px minmax(0,1fr)}

/* the brief's delivery */
.rl-ai .ai-brief-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--ink2)}
.rl-ai .ai-brief-row .sp{flex:1}
.rl-ai .ai-brief-row input.ai-in{display:inline-block;width:auto}

/* the feed: what was sent, as which agent, under which brain */
.rl-ai .ai-feed{display:flex;flex-direction:column}
.rl-ai .ai-fitem{display:grid;grid-template-columns:96px 26px minmax(0,1fr);gap:12px;align-items:start;padding:12px 4px;border-bottom:1px solid var(--line)}
.rl-ai .ai-fitem .tm{font-size:11.5px;color:var(--ink4);padding-top:3px;white-space:nowrap}
.rl-ai .ai-fitem .av{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;color:var(--ink3);background:var(--paper2)}
.rl-ai .ai-fitem .who{font-size:12.5px;color:var(--ink3)}
.rl-ai .ai-fitem .who b{color:var(--ink);font-weight:600}
.rl-ai .ai-fitem .who span{margin-left:6px;color:var(--ink4)}
.rl-ai .ai-fitem .who .bad{color:var(--acc)}
.rl-ai .ai-fitem p{margin:4px 0 0;font-size:13.5px;line-height:1.6;color:var(--ink2);white-space:pre-wrap;overflow-wrap:anywhere}

@media (max-width: 860px){
  .rl-ai .ai-seg{align-self:flex-start;margin-top:8px}
  .rl-ai .ai-charts{grid-template-columns:minmax(0,1fr)}
  .rl-ai .ai-trow{grid-template-columns:32px minmax(0,1fr) 20px;row-gap:6px}
  .rl-ai .ai-trow .c{grid-column:2;display:inline-block}
  .rl-ai .ai-trow .c b{display:inline;font-size:13px}
  .rl-ai .ai-trow .c span{display:inline;margin-left:4px}
  .rl-ai .ai-trow .c .ai-delta{margin-left:6px}
  .rl-ai .ai-fitem{grid-template-columns:26px minmax(0,1fr);}
  .rl-ai .ai-fitem .tm{grid-column:2;order:3;padding-top:0}
  .rl-ai .ai-irow.is-two{grid-template-columns:minmax(0,1fr)}
}

/* The period switch sat beside the title in one row and pushed 22px past a 375px screen; the header wraps now. */
@media (max-width: 860px){
  .rl-ai .ai-phead{flex-wrap:wrap}
  .rl-ai .ai-phead .ai-seg{flex-basis:100%;align-self:flex-start;margin-top:10px}
  .rl-ai .ai-view[data-view="activity"]{overflow-x:hidden}
}

/* ═══ custom skills: the builder ═══════════════════════════════════════════
   A form that reads like a brief, and the same test chat the agents have.
   Live is a claim the server checks, so the page never pretends. */
.rl-ai .ai-skill.is-custom .ic{color:var(--acc);background:var(--acc-soft)}
.rl-ai .ai-skill.is-custom .kind{color:var(--acc)}
.rl-ai .ai-skill.is-draft .kind{color:#a9741f}
.rl-ai .ai-draft{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;font-size:11px;font-weight:700;color:#a9741f;background:#fbf1de}
.rl-ai .ai-draft.is-live{color:var(--ok);background:color-mix(in srgb,var(--ok) 10%,#fff)}
.rl-ai .ai-form .ai-in.is-ta{display:block;width:100%;min-height:110px!important;padding:11px 13px;border:0!important;border-radius:12px;
  background:#fff!important;box-shadow:inset 0 0 0 1px var(--line2)!important;font:inherit;font-size:13.5px!important;line-height:1.6;color:var(--ink);resize:vertical;outline:0}
.rl-ai .ai-form .ai-in.is-ta:focus{box-shadow:inset 0 0 0 1.5px #c9c4b9!important}
.rl-ai .ai-form input.ai-in{font-size:13.5px!important}
.rl-ai .ai-form .ai-in::placeholder{color:var(--ink4)}
.rl-ai .ai-test-h select.ai-in{width:auto;display:inline-block;padding:5px 26px 5px 9px;font-size:12px!important;border-radius:8px}
.rl-ai .rl-btn.is-danger{color:#9f2d1c;background:none;box-shadow:inset 0 0 0 1px #f0cfc6}
.rl-ai .rl-btn.is-danger:hover{background:var(--acc-soft)}

/* ═══ the brain ════════════════════════════════════════════════════════════
   The Brand Brain, moved in from Settings (owner, 2026-09-22: "Brand Brain we
   can move to AI CMO … redesign smartly as per AI CMO"). Same shape as Agents:
   a card per section opens it, Back and Next between them; the redesign
   (bx-*) is at the end of this sheet. /ui/ai-brain.js. */
.rl-ai .ai-view[data-view="brain"]{overflow-y:auto;overscroll-behavior:contain}
.rl-ai .ai-savedat{font-size:12px;color:var(--ink4);align-self:center}

/* ── the mark and the gauge ────────────────────────────────────────────────
   `--life` is the strength, 0 to 1, and drives everything: orbit brightness,
   every speed, the halo, the arc. An untaught brain is dim and slow; a full
   one is alive — the same fact as the percentage, told a second way, which is
   the only honest reason to animate anything here. Colours are tuned for
   paper: the track and the arc's ground are ink, not white. */
.rl-ai .ai-mind{--life:0;position:relative;flex:none;width:84px;height:84px;display:grid;place-items:center}
.rl-ai .ai-mind>*{grid-area:1/1}
.rl-ai .ai-mind .halo{width:70px;height:70px;border-radius:50%;background:radial-gradient(circle,rgba(241,91,65,calc(.12 + var(--life) * .38)) 0%,transparent 66%);animation:aiBreathe calc(6s - var(--life) * 1.6s) ease-in-out infinite}
@keyframes aiBreathe{0%,100%{transform:scale(.9);opacity:.75}50%{transform:scale(1.12);opacity:1}}
.rl-ai .ai-mind .wave{width:46px;height:46px;border-radius:50%;border:1px solid rgba(241,91,65,calc(.16 + var(--life) * .44));animation:aiWave calc(4.4s - var(--life) * 1.2s) cubic-bezier(.25,.6,.3,1) infinite}
.rl-ai .ai-mind .wave.w2{animation-delay:calc((4.4s - var(--life) * 1.2s) / -2)}
@keyframes aiWave{0%{transform:scale(.72);opacity:0}18%{opacity:1}100%{transform:scale(1.8);opacity:0}}
.rl-ai .ai-mind .track{width:74px;height:74px;border-radius:50%;border:1px solid rgba(27,26,23,calc(.06 + var(--life) * .08))}
.rl-ai .ai-mind .orb{position:relative;border-radius:50%;animation:aiSpin linear infinite}
.rl-ai .ai-mind .orb i{position:absolute;top:-3px;left:50%;width:6px;height:6px;margin-left:-3px;border-radius:50%;opacity:calc(.3 + var(--life) * .7)}
.rl-ai .ai-mind .o1{width:74px;height:74px;animation-duration:calc(13s - var(--life) * 4.5s)}
.rl-ai .ai-mind .o1 i{background:#f15b41;box-shadow:0 0 8px rgba(241,91,65,.7)}
.rl-ai .ai-mind .o2{width:58px;height:58px;animation-duration:calc(9s - var(--life) * 3s);animation-direction:reverse}
.rl-ai .ai-mind .o2 i{width:5px;height:5px;margin-left:-2.5px;background:#e0a23c;box-shadow:0 0 8px rgba(224,162,60,.7)}
.rl-ai .ai-mind .o3{width:84px;height:84px;animation-duration:calc(19s - var(--life) * 6s);animation-delay:-4s}
.rl-ai .ai-mind .o3 i{width:4px;height:4px;margin-left:-2px;top:-2px;background:#3f8fd8;box-shadow:0 0 7px rgba(63,143,216,.6)}
@keyframes aiSpin{to{transform:rotate(360deg)}}
.rl-ai .ai-mind .core{position:relative;width:46px;height:46px;border-radius:15px;display:grid;place-items:center;color:#fff;background:linear-gradient(152deg,#f87358,#e0472c);box-shadow:0 10px 22px -8px rgba(241,91,65,calc(.3 + var(--life) * .5)),inset 0 1px 0 rgba(255,255,255,.38);animation:aiCore calc(7s - var(--life) * 2s) ease-in-out infinite}
.rl-ai .ai-mind .core::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,rgba(255,255,255,.28),transparent 52%);pointer-events:none}
@keyframes aiCore{0%,100%{transform:scale(1)}50%{transform:scale(1.035)}}
/* The old ring was a conic-gradient with a transition on it; a gradient is a
   background image and does not interpolate. An arc's dashoffset is a length. */
.rl-ai .ai-gauge{position:relative;flex:none;width:64px;height:64px;display:grid;place-items:center}
.rl-ai .ai-gauge svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);overflow:visible}
.rl-ai .ai-gauge circle{fill:none;stroke-width:4.5;stroke-linecap:round}
.rl-ai .ai-gauge .trk{stroke:rgba(27,26,23,.09)}
.rl-ai .ai-gauge .val{--life:0;stroke:var(--acc);stroke-dasharray:119.38;stroke-dashoffset:calc(119.38 * (1 - var(--life)));transition:stroke-dashoffset 1.1s cubic-bezier(.2,.8,.2,1)}
.rl-ai .ai-gauge b{font-size:14px;font-weight:800;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums}
.rl-ai .ai-gauge span{position:absolute;bottom:-16px;font-size:9.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink4)}
@media (prefers-reduced-motion:reduce){
  .rl-ai .ai-mind .halo,.rl-ai .ai-mind .core,.rl-ai .ai-mind .orb{animation:none}
  .rl-ai .ai-mind .wave{display:none}
  .rl-ai .ai-gauge .val{transition:none}
}

/* ── a section ─────────────────────────────────────────────────────────────*/
.rl-ai .ai-detail .ai-form{margin-top:24px;max-width:680px}
.rl-ai .ai-in,.rl-ai textarea.ai-in,.rl-ai select.ai-in{display:block;width:100%;min-width:0;min-height:0!important;box-sizing:border-box;padding:11px 13px;border:0!important;border-radius:11px;background:#fff!important;box-shadow:inset 0 0 0 1px var(--line2)!important;font:inherit;font-size:13.5px!important;line-height:1.5;color:var(--ink)!important;outline:0;resize:vertical}
.rl-ai .ai-in:focus,.rl-ai textarea.ai-in:focus,.rl-ai select.ai-in:focus{box-shadow:inset 0 0 0 1.5px #c9c4b9!important}
.rl-ai .ai-in::placeholder{color:var(--ink4)}
.rl-ai select.ai-in{appearance:none;-webkit-appearance:none;padding-right:34px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2385827a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 12px center!important;background-size:15px!important}
.rl-ai .ai-colour{display:flex;align-items:center;gap:8px}
.rl-ai .ai-colour .sw{flex:none;width:36px;height:36px;border-radius:11px;box-shadow:inset 0 0 0 1px var(--line2);background:var(--paper2)}
.rl-ai .ai-colour .sw.is-set{box-shadow:inset 0 0 0 1px rgba(27,26,23,.12)}
.rl-ai .ai-stepbar{display:flex;align-items:center;gap:12px;margin:28px 0 8px;padding-top:18px;border-top:1px solid var(--line)}
.rl-ai .ai-stepbar .n{flex:1;text-align:center;font-size:12px;font-weight:600;color:var(--ink4);font-variant-numeric:tabular-nums}

/* ── knowledge ─────────────────────────────────────────────────────────────*/
.rl-ai .ai-kbai{margin:16px 0 6px;padding:16px 18px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ai-kbai[hidden]{display:none}
.rl-ai .ai-drafthd{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:16px 0 8px;font-size:12.5px;line-height:1.5;color:var(--ink3)}
.rl-ai .ai-drafthd span{flex:1;min-width:200px}
.rl-ai .ai-draftk{padding:12px;border-radius:14px;background:var(--paper2);margin-bottom:8px}
.rl-ai .ai-draftk .r{display:flex;align-items:center;gap:8px;margin-bottom:7px}
.rl-ai .ai-draftk .r:last-child{margin:7px 0 0}
.rl-ai .ai-draftk .r .ai-in{flex:1;font-weight:600}


@media (max-width:760px){
  .rl-ai .ai-stepbar{flex-wrap:wrap}
  .rl-ai .ai-stepbar .n{flex:none;width:100%;order:-1;text-align:left}
  .rl-ai .ai-stepbar .rl-btn{flex:1;justify-content:center}
}

/* ═══ the CMO's desk ═══════════════════════════════════════════════════════
   Redesign, 2026-09-23 (owner: "something better and more premium for AI
   CMO", then "go ahead, build it"; canvas "AI CMO redesign").

   The greeting and the box sit on ONE dark surface — the house AI-zone
   treatment — so the page reads as a place you talk to someone, and what is
   under it (what needs you, the goals, the agents) reads as their desk. Every
   rule is scoped to the EMPTY state: once a conversation starts the desk turns
   into `display:contents` and the thread and box lay out exactly as before. */
.rl-ai .askp-main:not(.chatting) .ai-desk{position:relative;flex:none;width:calc(100% - 52px);max-width:1080px;margin:24px auto 0;padding:40px 48px 34px;
  border-radius:28px;background:#161a24;box-shadow:0 40px 80px -44px rgba(16,24,40,.6)}
.rl-ai .askp-main.chatting .ai-desk{display:contents}
.rl-ai .askp-main.chatting .ai-glows{display:none}
/* The glows are clipped in their own layer, so the desk never clips the
   studios menu that opens above the box. */
.rl-ai .ai-glows{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}
.rl-ai .ai-glows i{position:absolute;border-radius:50%}
.rl-ai .ai-glows i:first-child{right:-160px;top:-220px;width:620px;height:620px;background:radial-gradient(closest-side,rgba(241,91,65,.3),rgba(241,91,65,0))}
.rl-ai .ai-glows i:last-child{left:-200px;bottom:-300px;width:560px;height:560px;background:radial-gradient(closest-side,rgba(109,63,214,.18),rgba(109,63,214,0))}
.rl-ai .askp-main:not(.chatting) .ai-desk > .askp-thread,
.rl-ai .askp-main:not(.chatting) .ai-desk > .askp-composer{position:relative}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-thread{padding:0}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-hero{max-width:900px}

/* what the voice you picked can see, said before anything else */
.rl-ai .askp-live{display:inline-flex;align-items:center;gap:9px;max-width:100%;min-height:30px;margin:0 0 22px;padding:5px 14px;border-radius:999px;
  font-size:12.5px;font-weight:600;line-height:1.35;color:#c9cfda;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.rl-ai .askp-live i{flex:none;width:7px;height:7px;border-radius:50%;background:#34d399;animation:aiLive 2s infinite}
.rl-ai .askp-live.is-off i{background:#98a1b3;animation:none}
@keyframes aiLive{0%{box-shadow:0 0 0 0 rgba(52,211,153,.55)}70%{box-shadow:0 0 0 8px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
.rl-ai .ai-desk .askp-hero-h{font-family:var(--serif);font-size:44px;font-weight:500;line-height:1.08;letter-spacing:-.02em;color:#fff;margin:0;text-wrap:balance}
.rl-ai .ai-desk .askp-hero-ask{margin:4px 0 0;font-family:var(--serif);font-size:44px;font-weight:400;font-style:italic;line-height:1.08;letter-spacing:-.02em;color:#ff9a85}

/* the box, as glass on the dark */
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-composer{padding:28px 0 0}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-composer > *{max-width:780px}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-cbox{border-radius:22px;background:rgba(255,255,255,.06);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),0 30px 60px -30px rgba(0,0,0,.6);transition:box-shadow .15s}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-cbox:focus-within{box-shadow:inset 0 0 0 1px rgba(255,154,133,.55),0 0 0 4px rgba(241,91,65,.14),0 30px 60px -30px rgba(0,0,0,.6)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-in{min-height:60px!important;padding:18px 22px 6px!important;font-size:17px!important;font-weight:500;color:#fff!important}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-in::placeholder{color:rgba(255,255,255,.42)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-cbar{gap:8px;padding:8px 12px 12px 16px}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-plus{width:36px;height:36px;border-radius:12px;color:#dfe3ec;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-plus:hover{color:#fff;background:rgba(255,255,255,.11)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-seg{background:rgba(0,0,0,.28);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-segb{height:30px;color:#c9cfda}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-segb:hover{color:#fff}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-segb.on{color:#fff;background:linear-gradient(180deg,#ff6b4f,#d6402a);box-shadow:0 6px 16px -8px rgba(241,91,65,.8)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-segb.on svg{color:#fff}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-send{width:42px;height:42px;border-radius:14px;background:linear-gradient(180deg,#ff6b4f,#d6402a);box-shadow:0 8px 22px -8px rgba(241,91,65,.7)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-send:hover{background:linear-gradient(180deg,#ff7a60,#c93a24)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-note{color:#98a1b3}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-cap svg{color:#7d869a}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-note > *:not(:first-child)::before{color:rgba(255,255,255,.25)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-sugg button{height:36px;padding:0 14px;font-size:13px;font-weight:600;color:#dfe3ec;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);transition:background .15s,color .15s}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-sugg button:hover{color:#fff;background:rgba(255,255,255,.11)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-sugg button svg{color:#ff9a85}

/* "Plan it as a goal", beside Send — in any state of the box */
.rl-ai .askp-goalbtn{display:inline-flex;align-items:center;gap:7px;flex:none;height:34px;padding:0 13px;border-radius:11px;font-size:12.5px;font-weight:700;white-space:nowrap;
  color:var(--ink2);background:#fff;box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .askp-goalbtn svg{color:var(--acc)}
.rl-ai .askp-goalbtn:hover{color:var(--ink);box-shadow:inset 0 0 0 1px #c9c4b9}
.rl-ai .askp-goalbtn:disabled{opacity:.45;cursor:default}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-goalbtn{height:38px;color:#fff;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-goalbtn svg{color:#ff9a85}
.rl-ai .askp-main:not(.chatting) .ai-desk .askp-goalbtn:hover{background:rgba(255,255,255,.14)}
.rl-ai .askp-goalbtn.is-nudge{animation:aiNudge .9s ease-out 2}
@keyframes aiNudge{0%{outline:0 solid rgba(241,91,65,.6);outline-offset:0}100%{outline:10px solid rgba(241,91,65,0);outline-offset:2px}}

/* the header: the brief behind its button, and the credits */
.rl-ai .ai-briefbtn svg{color:var(--acc)}
.rl-ai .ai-briefbtn .new{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:2px 6px;border-radius:6px;color:#b93520;background:#fff1ed}
.rl-ai .ai-cred svg{color:var(--acc)}

/* ── under the desk ──────────────────────────────────────────────────────── */
.rl-ai .askp-main:not(.chatting) .ai-under{width:calc(100% - 52px);max-width:1080px}
.rl-ai .ai-under .ai-sec{margin:34px 0 12px}
.rl-ai .ai-under .ai-sec h3{font-size:17px;font-weight:800;letter-spacing:-.01em}
.rl-ai .ai-under .ai-sec > span{font-size:13px}
.rl-ai .ai-need{gap:16px;padding:16px 18px;border-radius:18px;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04);transition:box-shadow .2s,transform .2s}
.rl-ai .ai-need:hover{transform:translateY(-1px);box-shadow:inset 0 0 0 1px var(--line2),0 14px 30px -18px rgba(27,26,23,.25)}
.rl-ai .ai-need .ic{width:42px;height:42px;border-radius:13px}
.rl-ai .ai-need .ic.is-bad{color:#be123c;background:#fff0f3}
.rl-ai .ai-need .ic.is-warn{color:#a15c07;background:#fff5e6}
.rl-ai .ai-need .ic.is-acc{color:#b93520;background:#fff1ed}
.rl-ai .ai-need .ic.is-info{color:#1d4ed8;background:#eef3ff}
.rl-ai .ai-need .ic.is-ok{color:#067a55;background:#e7f7f0}
.rl-ai .ai-need .tx b{font-size:14.5px}
.rl-ai .ai-need .tx span{font-size:13px;color:var(--ink2)}
.rl-ai .ai-need .rl-btn.is-sm{height:34px;padding:0 14px;font-size:12.5px;border-radius:10px}

/* goals on the left, the agents beside them */
.rl-ai .ai-cols{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:28px;align-items:start}
.rl-ai .ai-block{min-width:0}
.rl-ai .ai-ring{position:relative;flex:none;display:grid;place-items:center}
.rl-ai .ai-ring svg{position:absolute;inset:0}
.rl-ai .ai-ring .tr{stroke:var(--line)}
.rl-ai .ai-ring .ar{stroke:var(--acc);transition:stroke-dashoffset .9s cubic-bezier(.2,.8,.2,1)}
.rl-ai .ai-ring b{position:relative;font-size:14px;font-weight:800;color:var(--ink)}
.rl-ai .ai-goalcard{display:flex;align-items:center;gap:18px;margin-bottom:10px;padding:18px 20px;border-radius:18px;background:#fff;cursor:pointer;
  box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04);transition:box-shadow .2s,transform .2s}
.rl-ai .ai-goalcard:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--line2),0 16px 34px -18px rgba(27,26,23,.28)}
.rl-ai .ai-goalcard:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.rl-ai .ai-goalcard .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.rl-ai .ai-goalcard .t b{font-size:15px;font-weight:700;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rl-ai .ai-goalcard .t > span:not(.strip){font-size:12.5px;color:var(--ink2)}
.rl-ai .ai-goalcard .strip{display:flex;gap:5px;margin-top:2px}
.rl-ai .ai-goalcard .strip i{flex:1 1 0;height:6px;border-radius:999px;background:var(--line)}
.rl-ai .ai-goalcard .strip i.is-live{background:var(--acc)}
.rl-ai .ai-goalcard .strip i.is-wait{background:#f2b33d}
.rl-ai .ai-goalcard .strip i.is-no{background:var(--line);opacity:.5}
.rl-ai .ai-goalcard .wait{flex:none;display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:700;color:#a15c07;background:#fff5e6}
.rl-ai .ai-goalcard .wait i{width:6px;height:6px;border-radius:50%;background:#d97706}
.rl-ai .ai-goalhint{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:18px;border:1.5px dashed var(--line2);font-size:13px;line-height:1.55;color:var(--ink2)}
.rl-ai .ai-goalhint > svg{flex:none;width:40px;height:40px;padding:10px;border-radius:12px;color:var(--ink2);background:var(--paper2)}
.rl-ai .ai-empty{padding:22px 22px 24px;border-radius:18px}

/* the CMO and the four it directs, each with the Agents view's own switch */
.rl-ai .ai-teamcard{border-radius:18px;background:#fff;overflow:hidden;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .ai-agent{display:flex;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--line)}
.rl-ai .ai-agent.is-cmo{border-top:0;padding:16px;background:linear-gradient(180deg,#fff7f4,#fff)}
.rl-ai .ai-agent.is-wait{padding:18px 16px;font-size:12.5px;color:var(--ink3)}
.rl-ai .ai-agent .av{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:var(--ink2);background:var(--paper2)}
.rl-ai .ai-agent.is-cmo .av{color:#ff9a85;background:#1e2230}
.rl-ai .ai-agent .av-qualify{color:#1d4ed8;background:#eef3ff}
.rl-ai .ai-agent .av-support{color:#6d3fd6;background:#f3efff}
.rl-ai .ai-agent .av-conversion{color:#b93520;background:#fff1ed}
.rl-ai .ai-agent .av-relationship{color:#067a55;background:#e7f7f0}
.rl-ai .ai-agent .t{flex:1;min-width:0}
.rl-ai .ai-agent .t b{display:block;font-size:14px;font-weight:700}
.rl-ai .ai-agent.is-cmo .t b{font-weight:800}
.rl-ai .ai-agent .t span{display:block;margin-top:1px;font-size:12.5px;line-height:1.4;color:var(--ink3)}
.rl-ai .ai-agent .st{flex:none;display:inline-flex;align-items:center;gap:6px;height:26px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:700;color:var(--ink3);background:var(--paper2)}
.rl-ai .ai-agent .st i{width:6px;height:6px;border-radius:50%;background:currentColor}
.rl-ai .ai-agent .st.is-on{color:#067a55;background:#e7f7f0}
.rl-ai .ai-agent .ai-sw{cursor:pointer}
.rl-ai .ai-agent .ai-sw:focus-visible{outline:2px solid var(--acc);outline-offset:2px}

/* a goal in the side rail: its name, and how far along it is */
.rl-ai .ai-sgoal{flex-direction:column;align-items:stretch;gap:6px;padding:8px 10px}
.rl-ai .ai-sgoal .pb{flex:none;display:block;height:4px;border-radius:999px;background:var(--line);overflow:hidden}
.rl-ai .ai-sgoal .pb i{display:block;height:100%;border-radius:999px;background:var(--acc)}

/* ── a plan, in the conversation ────────────────────────────────────────────
   Drawn from the goal as it is now, so a step approved elsewhere says so. */
.rl-ai .ai-plan{margin-top:16px;border-radius:20px;background:#fff;overflow:hidden;box-shadow:inset 0 0 0 1px var(--line),0 14px 34px -22px rgba(27,26,23,.3)}
.rl-ai .ai-plan .hd{display:flex;align-items:center;gap:14px;padding:18px 20px;background:linear-gradient(180deg,#fff7f4,#fff)}
.rl-ai .ai-plan .hd .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rl-ai .ai-plan .ey{font-size:10.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#b93520}
.rl-ai .ai-plan .hd b{font-family:var(--serif);font-size:19px;font-weight:500;letter-spacing:-.015em;line-height:1.3;color:var(--ink)}
.rl-ai .ai-plan .hd .t > span:last-child{font-size:12.5px;color:var(--ink3)}
.rl-ai .ai-plan .step{display:flex;align-items:flex-start;gap:12px;padding:14px 20px;border-top:1px solid var(--line)}
.rl-ai .ai-plan .step .n{flex:none;width:24px;height:24px;margin-top:1px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:700;color:var(--ink2);background:var(--paper2)}
.rl-ai .ai-plan .step .t{flex:1;min-width:0}
.rl-ai .ai-plan .step .t b{display:block;font-size:14px;font-weight:700;line-height:1.4;color:var(--ink)}
.rl-ai .ai-plan .step .t > span{display:block;margin-top:2px;font-size:13px;line-height:1.55;color:var(--ink2)}
.rl-ai .ai-plan .step .t em{display:inline-flex;align-items:center;gap:5px;margin-top:6px;font-style:normal;font-size:11.5px;font-weight:600;color:var(--ink3)}
.rl-ai .ai-plan .step.is-no .t{opacity:.55}
.rl-ai .ai-plan .acts{flex:none;display:flex;gap:6px}
.rl-ai .ai-plan .pill{flex:none;display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap}
.rl-ai .ai-plan .pill.is-on{color:#067a55;background:#e7f7f0}
.rl-ai .ai-plan .pill.is-no{color:var(--ink3);background:var(--paper2)}
.rl-ai .ai-plan .ft{display:flex;align-items:center;gap:9px;padding:12px 20px;font-size:12.5px;line-height:1.5;color:var(--ink3);background:var(--paper2)}
.rl-ai .ai-plan .ft svg{flex:none;color:#067a55}
.rl-ai .ai-plan .sk{height:46px;margin:0 20px 10px;border-radius:12px;background:linear-gradient(90deg,var(--paper2) 25%,#fbfaf7 50%,var(--paper2) 75%);background-size:200% 100%;animation:aiSk 1.3s linear infinite}
.rl-ai .ai-plan.is-loading .hd{margin-bottom:6px}
@keyframes aiSk{to{background-position:-200% 0}}
.rl-ai .ai-plan.is-gone{display:flex;align-items:center;gap:8px;padding:12px 14px;font-size:13px;color:var(--ink3);background:var(--paper2);box-shadow:none}

@media (max-width: 1100px){
  .rl-ai .ai-cols{grid-template-columns:minmax(0,1fr);gap:0}
}
@media (max-width: 860px){
  /* The Ask page's phone rules carry !important and assume a paper box, so
     the desk answers each one it contests, and no others. */
  .rl-ai .askp-main:not(.chatting) .ai-desk{width:calc(100% - 24px);margin-top:12px;padding:24px 16px 18px;border-radius:22px}
  .rl-ai .askp-main:not(.chatting) .ai-desk .askp-thread{padding:0!important;display:block!important}
  .rl-ai .askp-main:not(.chatting) .ai-desk .askp-composer{padding:20px 0 0!important;background:none!important}
  .rl-ai .ai-desk .askp-hero-h,.rl-ai .ai-desk .askp-hero-ask{font-size:30px!important}
  .rl-ai .ai-desk .askp-hero-h{color:#fff!important;font-weight:500!important;letter-spacing:-.02em!important}
  .rl-ai .askp-live{margin-bottom:16px;font-size:12px;text-align:left}
  .rl-ai .askp-main:not(.chatting) .ai-desk .askp-cbar{padding:6px 8px 8px 10px;gap:6px}
  .rl-ai .askp-main:not(.chatting) .ai-desk .askp-in{font-size:16px!important;padding:14px 14px 4px!important}
  .rl-ai .askp-main:not(.chatting) .ai-desk .askp-send{width:38px!important;height:38px!important;border-radius:12px!important;background:linear-gradient(180deg,#ff6b4f,#d6402a)!important}
  .rl-ai .askp-goalbtn{width:34px;padding:0;justify-content:center}
  .rl-ai .askp-main:not(.chatting) .ai-desk .askp-goalbtn{width:38px}
  .rl-ai .askp-goalbtn span{display:none}
  .rl-ai .askp-main:not(.chatting) .ai-desk .askp-note{color:#98a1b3!important;justify-content:center;gap:4px 14px!important}
  /* On a phone the note wraps (and the theme draws its parts as pills), so a
     separator only ever strands at the start of a line. */
  .rl-ai .askp-note > *::before{display:none}
  .rl-ai .askp-main:not(.chatting) .ai-desk .askp-cap{background:none;padding:0}
  /* the theme paints the starter row as a paper band on a phone */
  .rl-ai .askp-main:not(.chatting) .ai-desk .askp-suggrow{background:none!important;padding:0!important}
  .rl-ai .askp-main:not(.chatting) .ai-desk .askp-suggrow button{min-height:36px!important;padding:0 13px!important;border:0!important;border-radius:999px!important;
    color:#dfe3ec!important;background:rgba(255,255,255,.05)!important;box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)!important}
  .rl-ai .askp-main:not(.chatting) .ai-under{width:calc(100% - 24px)}
  .rl-ai .ai-under .ai-sec{flex-wrap:wrap;margin-top:26px}
  .rl-ai .ai-need .acts{margin-left:58px;max-width:calc(100% - 58px)}
  .rl-ai .ai-goalcard{flex-wrap:wrap;gap:14px;padding:16px}
  .rl-ai .ai-goalcard .wait{margin-left:74px}
  .rl-ai .ai-plan .hd{flex-wrap:wrap}
  .rl-ai .ai-plan .hd .rl-btn{margin-left:66px}
  .rl-ai .ai-plan .step{flex-wrap:wrap;padding:14px 16px}
  /* The text takes the row, so the buttons wrap under it instead of the text
     shrinking to a column one word wide. */
  .rl-ai .ai-plan .step .t{flex:1 1 calc(100% - 36px)}
  .rl-ai .ai-plan .step .acts,.rl-ai .ai-plan .step .pill{margin-left:36px}
  .rl-ai .ai-plan .hd .t{flex:1 1 calc(100% - 66px)}
}
@media (prefers-reduced-motion:reduce){
  .rl-ai .askp-live i,.rl-ai .askp-goalbtn.is-nudge,.rl-ai .ai-plan .sk{animation:none}
  .rl-ai .ai-need,.rl-ai .ai-goalcard,.rl-ai .ai-ring .ar{transition:none}
  .rl-ai .ai-need:hover,.rl-ai .ai-goalcard:hover{transform:none}
}

/* ── this week's brief, the drawer ──────────────────────────────────────────
   It opens in the overlay root, outside the section, so it carries its own
   colours rather than the section's tokens. */
.rl-drawer .ai-briefd{flex:1;min-height:0;display:flex;flex-direction:column;background:#fff;color:#0f1218}
.ai-briefd .hd{position:relative;flex:none;overflow:hidden;padding:24px 26px;background:#161a24;color:#fff}
.ai-briefd .hd .glow{position:absolute;right:-120px;top:-170px;width:420px;height:420px;border-radius:50%;background:radial-gradient(closest-side,rgba(241,91,65,.32),rgba(241,91,65,0));pointer-events:none}
.ai-briefd .top{position:relative;display:flex;align-items:center;gap:10px}
.ai-briefd .ey{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#ff9a85}
.ai-briefd .x{margin-left:auto;width:32px;height:32px;border:0;border-radius:10px;display:grid;place-items:center;cursor:pointer;color:#c9cfda;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.ai-briefd .x:hover{color:#fff;background:rgba(255,255,255,.12)}
.ai-briefd h2{position:relative;margin:14px 0 0;font-family:"Fraunces",Georgia,serif;font-size:26px;font-weight:500;line-height:1.22;letter-spacing:-.02em;color:#fff;text-wrap:balance}
.ai-briefd .hd p{position:relative;margin:10px 0 0;font-size:13px;line-height:1.55;color:#98a1b3}
.ai-briefd .bd{flex:1;min-height:0;overflow-y:auto;padding:4px 26px 18px}
.ai-briefd section{padding:18px 0;border-bottom:1px solid #e6e8ef}
.ai-briefd section:last-child{border-bottom:0}
.ai-briefd .k{margin-bottom:10px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#8a92a6}
.ai-briefd .ln{display:flex;gap:11px;padding:5px 0;font-size:14px;line-height:1.6;color:#2a3040}
.ai-briefd .ln i{flex:none;width:6px;height:6px;margin-top:9px;border-radius:50%;background:#f15b41}
.ai-briefd .ask{display:flex;align-items:center;gap:12px;margin-bottom:8px;padding:12px 14px;border-radius:14px;font-size:13.5px;line-height:1.5;background:#fff7f4;box-shadow:inset 0 0 0 1px #ffd9cf}
.ai-briefd .ask span{flex:1;min-width:0}
.ai-briefd .ft{flex:none;display:flex;align-items:center;gap:10px;padding:14px 18px;border-top:1px solid #e6e8ef;background:#fbfbfd}
.ai-briefd-ask{flex:1;min-width:0;display:flex;align-items:center;gap:9px;height:42px;padding:0 14px;border:0;border-radius:12px;cursor:pointer;text-align:left;
  font:inherit;font-size:13.5px;color:#646c7f;background:#fff;box-shadow:inset 0 0 0 1px #dfe2ea}
.ai-briefd-ask:hover{color:#0f1218;box-shadow:inset 0 0 0 1px #c9cedb}
.ai-briefd-ask svg{flex:none;color:#f15b41}
.ai-briefd-ask span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ── Goals, inside the section ─────────────────────────────────────────────
   The Goals page's own list and detail (#goalsList, moved in on first use),
   so a goal opens here instead of bouncing back to Home. */
.rl-ai .ai-view[data-view="goals"]{overflow-y:auto}
.rl-ai .ai-goalsbody{margin:22px 0 48px}
/* The page gave its list, strip and label a phone gutter of their own (--dg);
   the section already has one. */
#page-ai .ai-view[data-view="goals"]{--dg:0px}
/* Its list label, in the section's label voice rather than a stray monospace. */
#page-ai .ai-goalsbody .gx-lbl{font-family:inherit!important;font-size:10.5px!important;font-weight:700!important;letter-spacing:.12em!important;text-transform:uppercase!important;color:var(--ink4)!important}
.rl-ai .ai-lbl{display:flex;align-items:center}
.rl-ai .ai-lbl a{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:.1em;color:var(--ink3);cursor:pointer}
.rl-ai .ai-lbl a:hover{color:var(--acc)}

/* ═══ Agents, redesigned (2026-09-23, the "Agents redesign" canvas) ════════
   The team on one dark panel with the customer's journey drawn under it; a
   short list of what only a person can decide; a card per agent. An agent's
   page opens on the same dark surface, with its tabs as pills under it. */
.rl-ai .ag-index{padding-bottom:40px}
.rl-ai .av-qualify{color:#1d4ed8;background:#eef3ff}
.rl-ai .av-support{color:#6d3fd6;background:#f3efff}
.rl-ai .av-conversion{color:#b93520;background:#fff1ed}
.rl-ai .av-relationship{color:#067a55;background:#e7f7f0}

/* the team panel */
.rl-ai .ag-desk{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,440px);gap:36px;margin-top:22px;padding:30px 34px 28px;border-radius:26px;background:#161a24;color:#fff;box-shadow:0 40px 80px -44px rgba(16,24,40,.6)}
.rl-ai .ag-glow{position:absolute;inset:0;border-radius:inherit;overflow:hidden;pointer-events:none}
.rl-ai .ag-glow i{position:absolute;border-radius:50%}
.rl-ai .ag-glow i:first-child{right:-180px;top:-240px;width:620px;height:620px;background:radial-gradient(closest-side,rgba(241,91,65,.26),rgba(241,91,65,0))}
.rl-ai .ag-glow i:last-child{left:-220px;bottom:-320px;width:560px;height:560px;background:radial-gradient(closest-side,rgba(109,63,214,.2),rgba(109,63,214,0))}
.rl-ai .ag-desk-l,.rl-ai .ag-map{position:relative;min-width:0;display:flex;flex-direction:column;gap:16px}
.rl-ai .ag-eyrow{display:flex;align-items:center;gap:10px}
.rl-ai .ag-eyrow .sp{flex:1}
.rl-ai .ag-desk .ey,.rl-ai .ag-hero .ey{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#ff9a85}
.rl-ai .ag-live{display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 11px;border-radius:999px;font-size:12px;font-weight:700;color:#c9cfda;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.rl-ai .ag-live i{width:7px;height:7px;border-radius:50%;background:#34d399;animation:agPulse 2s infinite}
.rl-ai .ag-live.is-off i{background:#98a1b3;animation:none}
@keyframes agPulse{0%{box-shadow:0 0 0 0 rgba(52,211,153,.55)}70%{box-shadow:0 0 0 8px rgba(52,211,153,0)}100%{box-shadow:0 0 0 0 rgba(52,211,153,0)}}
.rl-ai .ag-desk h2{margin:0;font-family:var(--serif);font-size:36px;font-weight:500;line-height:1.1;letter-spacing:-.02em;color:#fff;text-wrap:balance}
.rl-ai .ag-desk .it{margin:-10px 0 0;font-family:var(--serif);font-size:30px;font-style:italic;line-height:1.15;letter-spacing:-.02em;color:#ff9a85}
.rl-ai .ag-figs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.rl-ai .ag-fig{display:flex;flex-direction:column;gap:3px;min-width:0;padding:13px 15px;border-radius:15px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.rl-ai .ag-fig b{font-size:22px;font-weight:800;letter-spacing:-.02em;line-height:1.1;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rl-ai .ag-fig span{font-size:12px;font-weight:600;color:#98a1b3}
.rl-ai .ag-fig i{font-style:normal;font-size:11.5px;font-weight:800}
.rl-ai .ag-fig i.up{color:#6ee7b7}
.rl-ai .ag-fig i.down{color:#fcd34d}
.rl-ai .ag-sparkw{display:flex;flex-direction:column;gap:8px}
.rl-ai .ag-sparkw span{font-size:12px;font-weight:600;color:#98a1b3}
.rl-ai .ag-spark{display:block;max-width:100%;overflow:visible}
.rl-ai .ag-spark .a{fill:rgba(241,91,65,.18)}
.rl-ai .ag-spark .l{fill:none;stroke:#ff9a85;stroke-width:2;stroke-linejoin:round;stroke-linecap:round}
.rl-ai .ag-spark .d{fill:#ff9a85;stroke:#161a24;stroke-width:2}
.rl-ai .ag-note{font-size:12px;line-height:1.5;font-weight:500;color:#7d869a}
.rl-ai .ag-map{padding:20px 22px 18px;border-radius:22px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.09)}
.rl-ai .ag-map .hd{display:flex;align-items:center;gap:10px}
.rl-ai .ag-map .hd b{font-size:15px;font-weight:800;color:#fff}
.rl-ai .ag-map .hd .sp{flex:1}
.rl-ai .ag-cover{display:inline-flex;align-items:center;height:28px;padding:0 11px;border-radius:999px;font-size:12px;font-weight:700;color:#fcd34d;background:rgba(251,191,36,.14)}
.rl-ai .ag-cover.is-ok{color:#6ee7b7;background:rgba(52,211,153,.14)}
/* the journey: three stretches, four stops, an agent riding each stretch */
.rl-ai .ag-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:4px 6px 0}
.rl-ai .ag-seg{position:relative;height:80px}
.rl-ai .ag-seg .ln{position:absolute;left:0;right:0;bottom:0;border-top:2px dashed rgba(255,255,255,.22)}
.rl-ai .ag-seg.is-on .ln{bottom:-1px;height:4px;border:0;border-radius:999px;background:repeating-linear-gradient(90deg,#f15b41 0 18px,#ff9a85 18px 28px);animation:agFlow 1.2s linear infinite}
@keyframes agFlow{to{background-position:28px 0}}
.rl-ai .ag-seg .nd{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:5px}
.rl-ai .ag-node{display:flex;align-items:center;gap:7px;height:38px;padding:0 11px 0 4px;border-radius:999px;cursor:pointer;white-space:nowrap;background:rgba(255,255,255,.06);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.rl-ai .ag-node .av{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;opacity:.7}
.rl-ai .ag-node b{font-size:12.5px;font-weight:700;color:#98a1b3}
.rl-ai .ag-seg.is-on .ag-node{background:#fff;box-shadow:0 10px 24px -10px rgba(0,0,0,.6)}
.rl-ai .ag-seg.is-on .ag-node .av{opacity:1}
.rl-ai .ag-seg.is-on .ag-node b{color:#0f1218;font-weight:800}
.rl-ai .ag-node:focus-visible,.rl-ai .ag-band:focus-visible{outline:2px solid #ff9a85;outline-offset:2px}
.rl-ai .ag-seg .un{font-size:11px;font-weight:700;color:#fcd34d}
.rl-ai .ag-stops{grid-column:1 / -1;position:relative;height:32px}
.rl-ai .ag-stops span{position:absolute;top:-7px;display:flex;flex-direction:column;align-items:center;gap:9px;transform:translateX(-50%);font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#98a1b3;white-space:nowrap}
.rl-ai .ag-stops span i{width:14px;height:14px;border-radius:50%;background:#161a24;box-shadow:0 0 0 3px rgba(255,255,255,.28)}
.rl-ai .ag-stops span:nth-child(1){left:0;transform:translateX(-7px);align-items:flex-start}
.rl-ai .ag-stops span:nth-child(2){left:33.333%}
.rl-ai .ag-stops span:nth-child(3){left:66.667%}
.rl-ai .ag-stops span:nth-child(4){left:100%;transform:translateX(calc(-100% + 7px));align-items:flex-end}
.rl-ai .ag-band{display:flex;align-items:center;gap:10px;height:46px;padding:0 14px 0 8px;border-radius:14px;cursor:pointer;text-align:left;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.rl-ai .ag-band.is-on{background:rgba(109,63,214,.22);box-shadow:inset 0 0 0 1px rgba(167,139,250,.45)}
.rl-ai .ag-band .av{width:30px;height:30px;border-radius:9px;display:grid;place-items:center}
.rl-ai .ag-band .t{display:flex;flex-direction:column;gap:1px}
.rl-ai .ag-band .t b{font-size:13px;font-weight:800;color:#fff}
.rl-ai .ag-band .t span{font-size:12px;font-weight:500;color:#c9cfda}

/* what only a person can decide */
.rl-ai .ag-sec{margin-top:30px}
.rl-ai .ag-sec .ai-sec{margin:0 0 12px}
.rl-ai .ag-sec .ai-sec h3{font-size:17px;font-weight:800;letter-spacing:-.01em}
.rl-ai .ag-need{display:flex;align-items:center;gap:14px;margin-bottom:8px;padding:14px 16px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .ag-need .ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center}
.rl-ai .ag-need .ic.is-acc{color:#b93520;background:#fff1ed}
.rl-ai .ag-need .ic.is-info{color:#6d3fd6;background:#f3efff}
.rl-ai .ag-need .ic.is-warn{color:#a15c07;background:#fff5e6}
.rl-ai .ag-need .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rl-ai .ag-need .tx b{font-size:14px;font-weight:800}
.rl-ai .ag-need .tx span{font-size:12.5px;line-height:1.45;color:var(--ink2)}
.rl-ai .ag-need .rl-btn{height:34px;padding:0 14px;font-size:12.5px;border-radius:10px}

/* the team, a card each */
.rl-ai .ag-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.rl-ai .ag-card{display:flex;flex-direction:column;gap:12px;padding:20px 20px 0;border-radius:22px;background:#fff;overflow:hidden;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04);transition:box-shadow .2s,transform .2s}
.rl-ai .ag-card:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--line2),0 18px 36px -20px rgba(27,26,23,.28)}
.rl-ai .ag-card.is-off{background:#fcfbf9}
.rl-ai .ag-card .hd{display:flex;align-items:flex-start;gap:14px}
.rl-ai .ag-card .hd .av{flex:none;width:50px;height:50px;border-radius:15px;display:grid;place-items:center;cursor:pointer}
.rl-ai .ag-card .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rl-ai .ag-card .nm{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px}
.rl-ai .ag-card .n{font-family:var(--serif);font-size:24px;font-weight:500;letter-spacing:-.015em;color:var(--ink);cursor:pointer;background:none;padding:0}
.rl-ai .ag-card .n:hover{color:var(--acc2)}
.rl-ai .ag-card .ow{font-size:13px;line-height:1.45;color:var(--ink3)}
.rl-ai .ag-card .hd .ai-sw{margin-top:6px;cursor:pointer}
.rl-ai .ag-card .stg{padding-left:64px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink4)}
.rl-ai .ag-card .wk{margin:4px 0 0;font-family:var(--serif);font-size:18px;line-height:1.4;color:var(--ink)}
.rl-ai .ag-state{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;font-size:11.5px;font-weight:800;color:#067a55;background:#e7f7f0;white-space:nowrap}
.rl-ai .ag-state i{width:6px;height:6px;border-radius:50%;background:currentColor}
.rl-ai .ag-state.is-off{color:var(--ink3);background:var(--paper2)}
.rl-ai .ag-state.is-wait{color:#a15c07;background:#fff5e6}
.rl-ai .ag-figs.is-light .ag-fig{background:var(--paper2);box-shadow:none}
.rl-ai .ag-figs.is-light .ag-fig b{color:var(--ink);font-size:20px}
.rl-ai .ag-figs.is-light .ag-fig span{color:var(--ink3)}
.rl-ai .ag-figs.is-light .ag-fig i.up{color:#067a55}
.rl-ai .ag-figs.is-light .ag-fig i.down{color:#a15c07}
.rl-ai .ag-chips{display:flex;flex-wrap:wrap;gap:7px}
.rl-ai .ag-chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:999px;font-size:12.5px;font-weight:600;color:var(--ink2);background:#fff;box-shadow:inset 0 0 0 1px var(--line2);white-space:nowrap}
.rl-ai .ag-chip svg{color:var(--ink3)}
.rl-ai .ag-chip.is-acc{color:#b93520;background:#fff1ed;box-shadow:inset 0 0 0 1px #ffd9cf}
.rl-ai .ag-chip.is-acc svg{color:#b93520}
.rl-ai .ag-chip.is-warn{color:#a15c07;background:#fff5e6;box-shadow:inset 0 0 0 1px #fbe0b8}
.rl-ai .ag-chip.is-warn svg{color:#a15c07}
.rl-ai .ag-miss{display:flex;gap:12px;padding:14px 16px;border-radius:14px;color:#a15c07;background:#fff5e6;box-shadow:inset 0 0 0 1px #fbe0b8}
.rl-ai .ag-miss > svg{flex:none;margin-top:1px}
.rl-ai .ag-miss div{display:flex;flex-direction:column;gap:3px}
.rl-ai .ag-miss b{font-size:14px;font-weight:800}
.rl-ai .ag-miss span{font-size:13px;line-height:1.5;color:var(--ink2)}
.rl-ai .ag-acts{display:flex;flex-wrap:wrap;gap:8px}
.rl-ai .ag-acts .rl-btn{height:40px;padding:0 15px;font-size:13px;border-radius:11px}
.rl-ai .ag-card .ft{display:flex;align-items:center;gap:12px;margin:auto -20px 0;padding:13px 20px;border-top:1px solid var(--line);background:var(--paper2)}
.rl-ai .ag-card .dots{display:flex}
.rl-ai .ag-card .dots i{width:26px;height:26px;margin-left:-6px;border-radius:50%;display:grid;place-items:center;color:var(--ink2);background:#fff;box-shadow:0 0 0 2px var(--paper2),inset 0 0 0 1px var(--line2)}
.rl-ai .ag-card .dots i:first-child{margin-left:0}
.rl-ai .ag-card .ft .k{font-size:12.5px;font-weight:600;color:var(--ink3)}
.rl-ai .ag-card .ft .sp{flex:1}
.rl-ai .ag-card .go{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:800;color:var(--ink);background:none;padding:0;cursor:pointer}
.rl-ai .ag-card .go:hover{color:var(--acc2)}
.rl-ai .ag-index .ai-soon{margin-top:16px}

/* an agent: the head, the pills, the overview */
.rl-ai .ag-hero{position:relative;display:flex;flex-direction:column;gap:20px;padding:22px 32px 24px;border-radius:26px;background:#161a24;color:#fff;box-shadow:0 40px 80px -44px rgba(16,24,40,.6)}
.rl-ai .ag-hero > *{position:relative}
.rl-ai .ag-hero > .ag-glow{position:absolute}
.rl-ai .ag-back{align-self:flex-start;display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 12px 0 9px;border-radius:10px;font-size:13px;font-weight:700;color:#dfe3ec;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.rl-ai .ag-back:hover{color:#fff;background:rgba(255,255,255,.11)}
.rl-ai .ag-hero-top{display:flex;align-items:center;gap:20px}
.rl-ai .ag-mark{position:relative;flex:none;width:80px;height:80px;display:grid;place-items:center}
.rl-ai .ag-mark .orb{position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(255,154,133,.32);animation:agOrbit 9s linear infinite}
.rl-ai .ag-mark .orb i{position:absolute;left:50%;border-radius:50%}
.rl-ai .ag-mark .orb i:first-child{top:-4px;width:8px;height:8px;margin-left:-4px;background:#ff9a85;box-shadow:0 0 12px rgba(255,154,133,.9)}
.rl-ai .ag-mark .orb i:last-child{bottom:-3px;width:6px;height:6px;margin-left:-3px;background:rgba(255,255,255,.4)}
.rl-ai .ag-hero.is-off .ag-mark .orb{animation:none;opacity:.4}
@keyframes agOrbit{to{transform:rotate(360deg)}}
.rl-ai .ag-mark .core{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;box-shadow:0 14px 30px -12px rgba(0,0,0,.6)}
.rl-ai .ag-hero-top .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rl-ai .ag-hero-top h1{margin:0;font-family:var(--serif);font-size:42px;font-weight:500;line-height:1.05;letter-spacing:-.02em;color:#fff}
.rl-ai .ag-hero-top p{margin:0;font-size:14px;color:#98a1b3}
.rl-ai .ag-state.is-dark{color:#6ee7b7;background:rgba(52,211,153,.14);height:30px;padding:0 12px;font-size:12.5px}
.rl-ai .ag-state.is-dark.is-off{color:#c9cfda;background:rgba(255,255,255,.08)}
.rl-ai .ag-state.is-dark.is-wait{color:#fcd34d;background:rgba(251,191,36,.14)}
.rl-ai .ag-hero .ai-sw.off{background:rgba(255,255,255,.2)}
.rl-ai .ag-hero .ai-sw{cursor:pointer}
.rl-ai .ag-hero-wk{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,520px);gap:32px;align-items:end}
.rl-ai .ag-hero-wk .sum{margin:0;font-family:var(--serif);font-size:26px;line-height:1.3;letter-spacing:-.01em;color:#fff}
.rl-ai .ag-tabs{gap:4px;margin:18px 0 0;padding:4px;border-radius:14px;border-bottom:0;background:#fff;box-shadow:inset 0 0 0 1px var(--line);align-self:flex-start;width:max-content;max-width:100%}
.rl-ai .ag-tabs a{display:inline-flex;align-items:center;gap:7px;height:36px;padding:0 15px;margin:0;border-radius:10px;border-bottom:0;font-weight:700;color:var(--ink3)}
.rl-ai .ag-tabs a.is-on{color:#fff;background:#161a24;border-bottom:0}
.rl-ai .ag-tabs a i{font-style:normal;min-width:18px;height:18px;padding:0 5px;border-radius:999px;display:inline-grid;place-items:center;font-size:10.5px;font-weight:800;color:#fff;background:var(--acc2)}
.rl-ai .ag-ov{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;align-items:start;margin-top:20px}
.rl-ai .ag-ov-main,.rl-ai .ag-ov-side{display:flex;flex-direction:column;gap:18px;min-width:0}
.rl-ai .ag-panel{display:flex;flex-direction:column;gap:14px;padding:20px 22px;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .ag-panel > .ai-sec{margin:0}
.rl-ai .ag-panel > .ai-sec h3{font-size:15.5px;font-weight:800}
.rl-ai .ag-panel .ai-figrow{margin:0}
.rl-ai .ag-skills{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px}
.rl-ai .ag-skill{display:flex;flex-direction:column;gap:7px;padding:14px;border-radius:15px;background:var(--paper2)}
.rl-ai .ag-skill .h{display:flex;align-items:center;gap:9px}
.rl-ai .ag-skill .ic{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:#b93520;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ag-skill b{font-size:13.5px;font-weight:700}
.rl-ai .ag-skill .w{font-size:12.5px;line-height:1.5;color:var(--ink3)}
.rl-ai .ag-skill .st{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:800;color:#067a55}
.rl-ai .ag-skill.is-off .st{color:#a15c07}
.rl-ai .ag-skill.is-off .ic{color:var(--ink3)}
.rl-ai .ag-prop{display:flex;flex-direction:column;gap:8px;padding:14px 15px;border-radius:15px;background:#fff7f4;box-shadow:inset 0 0 0 1px #ffd9cf}
.rl-ai .ag-prop b{font-size:13.5px;font-weight:800}
.rl-ai .ag-prop q{font-family:var(--serif);font-size:15px;line-height:1.45;color:var(--ink);quotes:"“" "”"}
.rl-ai .ag-prop .ev{font-size:12px;font-weight:600;color:#b93520}
.rl-ai .ag-prop .act{display:flex;flex-wrap:wrap;gap:8px}
.rl-ai .ag-ceil{display:flex;align-items:flex-end;gap:16px}
.rl-ai .ag-ceil > div{display:flex;flex-direction:column;gap:2px}
.rl-ai .ag-ceil .k{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--ink4)}
.rl-ai .ag-ceil b{font-family:var(--serif);font-size:44px;font-weight:500;line-height:1;letter-spacing:-.02em}
.rl-ai .ag-ceil .bar{flex:1;height:8px;margin-bottom:8px;border-radius:999px;background:var(--line);overflow:hidden}
.rl-ai .ag-ceil .bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#ff9a85,#f15b41)}
.rl-ai .ag-offer{display:flex;align-items:center;gap:10px;padding:11px 13px;border-radius:13px;font-size:13px;font-weight:600;color:var(--ink2);background:var(--paper2)}
.rl-ai .ag-offer span{flex:1;min-width:0}
.rl-ai .ag-offer b{color:var(--ink);font-weight:800}
.rl-ai .ag-offer.is-empty{color:#a15c07;background:#fff5e6}
.rl-ai .ag-never{display:flex;gap:10px;padding:13px;border-radius:13px;font-size:12.5px;line-height:1.55;color:var(--ink2);box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .ag-never > svg{flex:none;color:#067a55;margin-top:1px}
.rl-ai .ag-never b{color:var(--ink)}
.rl-ai .ag-panel .ai-kv{margin:0;max-width:none}

@media (max-width: 1100px){
  .rl-ai .ag-desk{grid-template-columns:minmax(0,1fr)}
  .rl-ai .ag-ov{grid-template-columns:minmax(0,1fr)}
  .rl-ai .ag-hero-wk{grid-template-columns:minmax(0,1fr)}
}
@media (max-width: 860px){
  .rl-ai .ag-desk{margin-top:16px;padding:22px 16px 18px;border-radius:22px;gap:22px}
  .rl-ai .ag-desk h2{font-size:28px}
  .rl-ai .ag-desk .it{font-size:24px;margin-top:-8px}
  .rl-ai .ag-fig{padding:11px 12px}
  .rl-ai .ag-fig b{font-size:18px}
  .rl-ai .ag-map{padding:16px 14px}
  .rl-ai .ag-node b{display:none}
  .rl-ai .ag-node{padding:0 4px}
  .rl-ai .ag-grid{grid-template-columns:minmax(0,1fr)}
  .rl-ai .ag-card .stg{padding-left:0}
  .rl-ai .ag-need{flex-wrap:wrap}
  .rl-ai .ag-need .rl-btn{margin-left:54px}
  .rl-ai .ag-hero{padding:18px 16px 20px;border-radius:22px}
  .rl-ai .ag-hero-top{flex-wrap:wrap;gap:14px}
  .rl-ai .ag-mark{width:64px;height:64px}
  .rl-ai .ag-mark .core{width:46px;height:46px;border-radius:15px}
  .rl-ai .ag-hero-top h1{font-size:32px}
  .rl-ai .ag-hero-top .t{flex:1 1 calc(100% - 84px)}
  .rl-ai .ag-hero-wk .sum{font-size:21px}
  .rl-ai .ag-tabs{width:auto;overflow-x:auto}
}
@media (prefers-reduced-motion:reduce){
  .rl-ai .ag-live i,.rl-ai .ag-seg.is-on .ln,.rl-ai .ag-mark .orb{animation:none}
  .rl-ai .ag-card{transition:none}
  .rl-ai .ag-card:hover{transform:none}
}
/* Conversion's objections: one bar each, split won / lost or stalled / open. */
.rl-ai .ai-irow.is-obj{grid-template-columns:150px 44px minmax(0,1fr) 210px;align-items:center}
.rl-ai .ai-irow .ob{display:flex;gap:2px;height:10px;min-width:8px}
.rl-ai .ai-irow .ob i{min-width:0;height:10px}
.rl-ai .ai-irow .ob i:first-child{border-radius:5px 0 0 5px}
.rl-ai .ai-irow .ob i:last-child{border-radius:0 5px 5px 0}
.rl-ai .ai-irow .ob .w{background:#0e9f6e}
.rl-ai .ai-irow .ob .d{background:#f2b33d}
.rl-ai .ai-irow .ob .o{background:#cfd4df}
@media (max-width: 760px){ .rl-ai .ai-irow.is-obj{grid-template-columns:120px 40px minmax(0,1fr)} .rl-ai .ai-irow.is-obj .sp{grid-column:1 / -1} }

/* ═══ Skills, redesigned (2026-09-23, the "Skills redesign" canvas) ═══════
   Light only. The page opens on whether the library can run; a card per
   skill answers what, when, who and can-it-run; the builder shows the
   server's rule (written, tested, live) as three steps. */
.rl-ai .sk-page,.rl-ai .sk-build{--wt:#8f5406;--wbg:#fcf3e2;--wl:#f1dcb2;--wd:#c27409;--okbg:#e8f4ec;--okt:#15703f;--acct:#b93520;--accl:#f8d5ca;--p3:#ebe8e1;--mono:"DM Mono",ui-monospace,monospace}
.rl-ai .sk-head{display:flex;align-items:flex-start;gap:24px;padding:34px 0 0}
.rl-ai .sk-head .tx{flex:1;min-width:0;max-width:680px}
.rl-ai .sk-head .ai-h1{font-size:40px;line-height:1.05}
.rl-ai .sk-head p{margin:12px 0 0;font-size:14.5px;line-height:1.6;color:var(--ink2)}
.rl-ai .sk-head .ai-hist{margin-top:6px}
.rl-ai .rl-btn.sk-create{flex:none;margin-left:auto;height:42px;padding:0 18px;border-radius:12px;font-size:13.5px;font-weight:700}

/* can the library run */
.rl-ai .sk-strip{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.45fr) minmax(0,1fr);margin-top:26px;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .sk-strip .c{display:flex;flex-direction:column;align-items:flex-start;gap:10px;min-width:0;padding:22px 24px}
.rl-ai .sk-strip .c+.c{border-left:1px solid var(--line)}
.rl-ai .sk-strip em,.rl-ai .sk-when em,.rl-ai .sk-may em,.rl-ai .sk-newc .ideas em,.rl-ai .sk-reads em{font-style:normal;font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
.rl-ai .sk-strip em.is-warn{color:var(--wt)}
.rl-ai .sk-big{display:flex;align-items:baseline;gap:8px}
.rl-ai .sk-big b{font-family:var(--serif);font-size:38px;font-weight:500;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.rl-ai .sk-big span{font-size:15px;font-weight:600;color:var(--ink3)}
.rl-ai .sk-segs{display:flex;gap:4px;width:100%;max-width:260px}
.rl-ai .sk-segs i{flex:1;height:6px;border-radius:999px;background:var(--ok)}
.rl-ai .sk-segs i.is-warn{background:var(--wd)}
.rl-ai .sk-sub{font-size:13px;line-height:1.5;color:var(--ink3)}
.rl-ai .sk-wrow{display:flex;gap:14px}
.rl-ai .sk-wrow>div{display:flex;flex-direction:column;align-items:flex-start;gap:4px;min-width:0}
.rl-ai .sk-wrow b{font-size:15px;font-weight:800;color:var(--ink)}
.rl-ai .sk-wrow span{font-size:13px;line-height:1.5;color:var(--ink2)}
.rl-ai .sk-wrow .rl-btn{margin-top:8px}
.rl-ai .sk-wic{flex:none;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;color:var(--wt);background:var(--wbg)}
.rl-ai .sk-wic.is-ok{color:var(--okt);background:var(--okbg)}
.rl-ai .sk-link{display:inline-flex;align-items:center;gap:6px;padding:0;border:0;background:none;cursor:pointer;font:inherit;font-size:13px;font-weight:800;color:var(--acct)}
.rl-ai .sk-link:hover{color:#8f2816}

/* the tabs and the search */
.rl-ai .sk-bar{display:flex;align-items:center;gap:14px;margin-top:30px}
.rl-ai .sk-bar .sp{flex:1}
.rl-ai .ai-filter.sk-tabs{display:inline-flex;flex-wrap:nowrap;gap:4px;margin:0;padding:4px;border-radius:14px;background:var(--paper2);box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .sk-tabs button{display:inline-flex;align-items:center;gap:8px;flex:none;height:34px;padding:0 14px;border:0;border-radius:10px;background:none;cursor:pointer;font:inherit;font-size:13px;font-weight:700;white-space:nowrap;color:var(--ink3)}
.rl-ai .sk-tabs button:hover{color:var(--ink)}
.rl-ai .sk-tabs button.is-on{color:var(--ink);background:#fff;box-shadow:0 1px 2px rgba(27,26,23,.08),inset 0 0 0 1px var(--line)}
.rl-ai .sk-tabs i{font-style:normal;font-family:var(--mono);font-size:11.5px;font-weight:500;color:var(--ink4)}
.rl-ai .sk-tabs .is-on i{color:var(--acct)}
.rl-ai .sk-search{display:flex;align-items:center;gap:8px;width:260px;height:42px;box-sizing:border-box;padding:0 12px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px var(--line2);color:var(--ink3)}
.rl-ai .sk-search:focus-within{box-shadow:inset 0 0 0 1.5px #c9c4b9}
.rl-ai .sk-search input{flex:1;min-width:0;min-height:0!important;height:auto!important;padding:0!important;border:0!important;outline:0;background:none!important;box-shadow:none!important;font:inherit;font-size:13.5px!important;color:var(--ink)}

/* the cards */
.rl-ai .sk-sec .ai-sec{margin:34px 0 14px}
.rl-ai .sk-sec .ai-sec h3{font-size:17px;font-weight:800;letter-spacing:-.01em}
.rl-ai .sk-sec .ai-sec span{font-size:13px}
.rl-ai .sk-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.rl-ai .sk-card{display:flex;flex-direction:column;gap:14px;min-width:0;padding:18px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04);transition:box-shadow .2s ease,transform .2s ease}
.rl-ai .sk-card:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px #d6d1c6,0 22px 40px -24px rgba(27,26,23,.32)}
.rl-ai .sk-card.is-off{background:#fdfcfa}
.rl-ai .sk-card[data-editskill]{cursor:pointer}
.rl-ai .sk-card:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.rl-ai .sk-top{display:flex;align-items:flex-start;gap:10px}
.rl-ai .sk-top .sp{flex:1}
.rl-ai .sk-ic{flex:none;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;color:var(--acct);background:var(--acc-soft)}
.rl-ai .sk-card.k-yours .sk-ic{color:var(--ink);background:var(--paper2)}
.rl-ai .sk-card.k-custom .sk-ic{color:var(--acc);background:#fff;box-shadow:inset 0 0 0 1.5px var(--accl)}
.rl-ai .sk-card.is-off .sk-ic{color:var(--ink3);background:var(--paper2);box-shadow:none}
.rl-ai .sk-name{margin-top:-4px;font-size:15.5px;font-weight:800;line-height:1.3;letter-spacing:-.01em;color:var(--ink)}
.rl-ai .sk-card.is-off .sk-name{color:var(--ink2)}
.rl-ai .sk-when{display:flex;flex-direction:column;gap:6px}
.rl-ai .sk-when p{margin:0;font-family:var(--serif);font-size:15.5px;line-height:1.45;color:var(--ink);text-wrap:pretty}
.rl-ai .sk-may{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.rl-ai .sk-may em{margin-right:2px;color:var(--ink4)}
.rl-ai .sk-may span{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 9px;border-radius:8px;font-size:12px;font-weight:600;color:var(--ink2);background:var(--paper);box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .sk-may .rl-ic{color:var(--ink3)}
.rl-ai .sk-tl{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;line-height:1.45;font-weight:600;color:var(--ink3)}
.rl-ai .sk-tl .rl-ic{flex:none;margin-top:1px}
.rl-ai .sk-tl.is-ok{color:var(--okt)}
.rl-ai .sk-tl.is-ok .rl-ic{color:var(--ok)}
.rl-ai .sk-tl.is-warn{color:var(--wt)}
.rl-ai .sk-tl.is-warn .rl-ic{color:var(--wd)}
.rl-ai .sk-note{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:12px 14px;border-radius:14px;background:var(--wbg);box-shadow:inset 0 0 0 1px var(--wl);font-size:12.5px;line-height:1.5;font-weight:600;color:var(--wt)}
.rl-ai .sk-fix{display:inline-flex;align-items:center;gap:6px;padding:0;border:0;background:none;cursor:pointer;font:inherit;font-size:12.5px;font-weight:800;color:var(--wt)}
.rl-ai .sk-fix:hover{text-decoration:underline}
.rl-ai .sk-ft{display:flex;align-items:center;gap:10px;min-height:32px;margin-top:auto;padding-top:13px;border-top:1px solid var(--line)}
.rl-ai .sk-ft small{flex:1;min-width:0;font-size:12px;line-height:1.45;color:var(--ink3)}
.rl-ai .sk-stack{display:flex;align-items:center;flex:none}
.rl-ai .sk-av{position:relative;width:24px;height:24px;margin-left:-7px;padding:0;border:0;border-radius:999px;display:grid;place-items:center;cursor:pointer;box-shadow:0 0 0 2px #fff;transition:transform .12s ease}
.rl-ai .sk-av:first-child{margin-left:0}
.rl-ai .sk-av:hover{transform:translateY(-2px);z-index:1}
.rl-ai .sk-who{flex:1;min-width:0;font-size:12px;font-weight:600;color:var(--ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rl-ai .sk-who.is-none{color:var(--ink4)}
.rl-ai .sk-card .ai-ready{font-size:12px;font-weight:700;color:var(--okt)}
.rl-ai .sk-pill,.rl-ai .sk-pill.ai-draft{display:inline-flex;align-items:center;gap:6px;flex:none;height:24px;margin:0;padding:0 10px;border:0;border-radius:999px;font-size:11.5px;font-weight:700;line-height:1;white-space:nowrap;color:var(--ink2);background:var(--paper2)}
.rl-ai .sk-pill i{width:6px;height:6px;border-radius:50%;background:currentColor}
.rl-ai .sk-pill.is-ok{color:var(--okt);background:var(--okbg)}
.rl-ai .sk-pill.is-ok i{background:var(--ok)}
.rl-ai .sk-pill.is-warn{color:var(--wt);background:var(--wbg)}
.rl-ai .sk-pill.is-warn i{background:var(--wd)}

/* the door to a new skill */
.rl-ai .sk-newc{grid-column:span 2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:22px;padding:20px 22px;border-radius:20px;background:#fffdfb;border:1.5px dashed var(--line2)}
.rl-ai .sk-newc.span-1{grid-column:span 1;grid-template-columns:minmax(0,1fr)}
.rl-ai .sk-newc.span-3{grid-column:span 3;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr)}
.rl-ai .sk-newc.span-4{grid-column:1 / -1;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr)}
.rl-ai .sk-newc .door{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.rl-ai .sk-newc .door .sk-ic{color:var(--acc);background:var(--acc-soft)}
.rl-ai .sk-newc .door b{font-size:15.5px;font-weight:800}
.rl-ai .sk-newc .door>span:not(.sk-ic){font-size:13px;line-height:1.55;color:var(--ink2)}
.rl-ai .sk-newc .door .rl-btn{margin-top:auto;height:38px;padding:0 14px;border-radius:11px;font-size:13px;font-weight:700}
.rl-ai .sk-newc .ideas{display:flex;flex-direction:column;min-width:0}
.rl-ai .sk-newc .ideas em{padding:2px 4px 10px}
.rl-ai .sk-newc .idea{display:flex;align-items:center;gap:12px;width:100%;padding:11px 4px;border:0;border-top:1px solid var(--line);background:none;cursor:pointer;font:inherit;text-align:left;color:var(--ink)}
.rl-ai .sk-newc .idea:hover{background:rgba(27,26,23,.025)}
.rl-ai .sk-newc .idea>span{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rl-ai .sk-newc .idea b{font-size:13.5px;font-weight:700}
.rl-ai .sk-newc .idea small{font-size:12px;color:var(--ink3)}
.rl-ai .sk-newc .idea .rl-ic{flex:none;color:var(--ink4)}
.rl-ai .sk-none{display:flex;align-items:center;gap:10px;margin-top:30px;padding:22px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font-size:14px;color:var(--ink2)}

/* the builder */
.rl-ai .sk-bhead{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:28px 0 0}
.rl-ai .sk-bhead .vr{width:1px;height:22px;background:var(--line2)}
.rl-ai .sk-bhead .ai-h1{font-size:30px}
.rl-ai .sk-bhead .sp{flex:1}
.rl-ai .rl-btn.sk-del{color:#a8232e}
.rl-ai .sk-steps{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:22px 0 0;padding:6px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .sk-steps li{display:flex;align-items:center;gap:12px;min-width:0;padding:12px 14px;border-radius:13px}
.rl-ai .sk-steps .n{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:800;color:var(--ink3);background:var(--p3)}
.rl-ai .sk-steps .t{display:flex;flex-direction:column;gap:2px;min-width:0}
.rl-ai .sk-steps b{font-size:13.5px;font-weight:800;color:var(--ink)}
.rl-ai .sk-steps small{font-size:12px;line-height:1.4;color:var(--ink3)}
.rl-ai .sk-steps .is-done .n{color:#fff;background:var(--ok)}
.rl-ai .sk-steps .is-now{background:#fffaf8;box-shadow:inset 0 0 0 1px var(--accl)}
.rl-ai .sk-steps .is-now .n{color:#fff;background:var(--acc);box-shadow:0 0 0 4px var(--acc-soft)}
.rl-ai .sk-steps .is-todo b{color:var(--ink3)}
.rl-ai .sk-cols{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:20px;align-items:start;margin-top:20px}
.rl-ai .sk-form{display:flex;flex-direction:column;min-width:0;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .sk-fld{display:flex;flex-direction:column;gap:12px;padding:22px 26px}
.rl-ai .sk-fld+.sk-fld{border-top:1px solid var(--line)}
.rl-ai .sk-fld>label{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;font-size:14px;font-weight:800;color:var(--ink)}
.rl-ai .sk-fld>label span{font-size:12.5px;font-weight:500;color:var(--ink3)}
.rl-ai .sk-form input.ai-in{height:46px;padding:0 14px;border-radius:12px;font-size:14.5px!important}
.rl-ai .sk-form input.ai-in.is-name{font-weight:700}
.rl-ai .sk-form .ai-in.is-ta{display:block;width:100%;box-sizing:border-box;min-height:124px!important;padding:12px 14px;border:0!important;border-radius:12px;background:#fff!important;box-shadow:inset 0 0 0 1px var(--line2)!important;font:inherit;font-size:14.5px!important;line-height:1.6;color:var(--ink);resize:vertical;outline:0}
.rl-ai .sk-form .ai-in.is-ta:focus{box-shadow:inset 0 0 0 1.5px #c9c4b9!important}
.rl-ai .sk-form .ai-in.is-ta::placeholder{color:var(--ink4)}
.rl-ai .sk-reads{display:flex;gap:12px;padding:14px 16px;border-radius:14px;background:var(--paper);box-shadow:inset 0 0 0 1px var(--line);color:var(--ink3)}
.rl-ai .sk-reads .rl-ic{flex:none;margin-top:2px}
.rl-ai .sk-reads>div{display:flex;flex-direction:column;gap:5px;min-width:0}
.rl-ai .sk-reads p{margin:0;font-family:var(--serif);font-size:15.5px;line-height:1.5;color:var(--ink2)}
.rl-ai .sk-acts{display:flex;flex-direction:column;border-radius:16px;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.rl-ai .sk-act{display:flex;gap:14px;padding:16px 18px;background:#fdfcfa}
.rl-ai .sk-act+.sk-act{border-top:1px solid var(--line)}
.rl-ai .sk-act.is-on{background:#fff}
.rl-ai .sk-act.is-fixed{background:var(--paper)}
.rl-ai .sk-act .bx{flex:none;width:24px;height:24px;margin-top:1px;padding:0;border:0;border-radius:8px;display:grid;place-items:center;cursor:pointer;color:#fff;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line2)}
.rl-ai .sk-act.is-on .bx{background:var(--acc);box-shadow:none}
.rl-ai .sk-act.is-fixed .bx{cursor:default;color:var(--ink3);background:var(--p3)}
.rl-ai .sk-act .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.rl-ai .sk-act .tx>b{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:14px;font-weight:700;color:var(--ink)}
.rl-ai .sk-act .tx>b i{display:inline-flex;align-items:center;height:20px;padding:0 8px;border-radius:999px;font-style:normal;font-size:10.5px;font-weight:700;color:var(--ink2);background:var(--paper2)}
.rl-ai .sk-act .tx>span{font-size:12.5px;line-height:1.5;color:var(--ink3)}
.rl-ai .sk-lk{display:flex;align-items:center;gap:10px;height:44px;box-sizing:border-box;margin-top:10px;padding:0 6px 0 12px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .sk-lk:focus-within{box-shadow:inset 0 0 0 1.5px #c9c4b9}
.rl-ai .sk-lk .m{flex:none;padding:3px 7px;border-radius:6px;font-family:var(--mono);font-size:11px;font-weight:500;color:var(--okt);background:var(--okbg)}
.rl-ai .sk-form .sk-lk input.ai-in{flex:1;min-width:0;height:40px;padding:0 4px!important;box-shadow:none!important;background:none!important;font-family:var(--mono)!important;font-size:12.5px!important}
.rl-ai .sk-vars{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-top:10px}
.rl-ai .sk-vars>span:first-child{margin-right:2px;font-size:12px;font-weight:600;color:var(--ink3)}
.rl-ai .sk-vars button{height:26px;padding:0 9px;border:0;border-radius:8px;cursor:pointer;font-family:var(--mono);font-size:12px;color:var(--acct);background:var(--acc-soft)}
.rl-ai .sk-vars button:hover{background:#fbdcd2}
.rl-ai .sk-vars .sp{flex:1}
.rl-ai .sk-vars .nt{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--ink3)}
.rl-ai .sk-hint{display:block;margin-top:8px;font-size:11.5px;line-height:1.5;color:var(--ink4)}
.rl-ai .sk-form input.ai-in.sk-tagin{height:40px;margin-top:10px;font-size:13px!important}
.rl-ai .sk-agents{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.rl-ai .sk-ag{display:flex;align-items:center;gap:12px;min-width:0;padding:12px 14px;border:0;border-radius:14px;cursor:pointer;font:inherit;text-align:left;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);transition:box-shadow .15s ease,background .15s ease}
.rl-ai .sk-ag:hover{box-shadow:inset 0 0 0 1.5px var(--line2)}
.rl-ai .sk-ag.is-on{background:#fffaf8;box-shadow:inset 0 0 0 1.5px var(--acc)}
.rl-ai .sk-ag .av{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center}
.rl-ai .sk-ag .tx{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rl-ai .sk-ag b{font-size:14px;font-weight:800;color:var(--ink)}
.rl-ai .sk-ag small{font-size:12px;line-height:1.35;color:var(--ink3)}
.rl-ai .sk-ag .ck{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;color:transparent;box-shadow:inset 0 0 0 1.5px var(--line2)}
.rl-ai .sk-ag.is-on .ck{color:#fff;background:var(--acc);box-shadow:none}
.rl-ai .sk-bfoot{display:flex;align-items:center;flex-wrap:wrap;gap:10px 12px;padding:18px 26px;border-top:1px solid var(--line);border-radius:0 0 22px 22px;background:var(--paper)}
.rl-ai .sk-bfoot .sp{flex:1}
.rl-ai .sk-bfoot .st{display:inline-flex;align-items:flex-start;gap:8px;min-width:0;max-width:440px;font-size:13px;line-height:1.5;font-weight:600;color:var(--ink3)}
.rl-ai .sk-bfoot .st .rl-ic{flex:none;margin-top:2px}
.rl-ai .sk-bfoot .st b{color:inherit}
.rl-ai .sk-bfoot .st.is-ok{color:var(--okt)}
.rl-ai .sk-bfoot .st.is-ok .rl-ic{color:var(--ok)}
.rl-ai .sk-bfoot .st.is-warn{color:var(--wt)}
.rl-ai .sk-bfoot .st.is-warn .rl-ic{color:var(--wd)}
.rl-ai .sk-bfoot .rl-btn{height:40px;padding:0 16px;border-radius:12px;font-size:13px;font-weight:700}
.rl-ai .rl-btn.sk-live{color:#fff;background:var(--acc);box-shadow:0 8px 18px -10px rgba(217,72,47,.7)}
.rl-ai .rl-btn.sk-live:hover{color:#fff;background:var(--acc2)}
.rl-ai .rl-btn.sk-live[disabled]{opacity:1;color:var(--ink3);background:var(--p3);box-shadow:none;cursor:not-allowed}

/* the test, beside the form */
.rl-ai .sk-side{position:sticky;top:16px;display:flex;flex-direction:column;gap:14px;min-width:0}
.rl-ai .sk-testp{display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .sk-th{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}
.rl-ai .sk-th .sp{flex:1}
.rl-ai .sk-tic{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:var(--acc);background:var(--acc-soft)}
.rl-ai .sk-th .tt{display:flex;flex-direction:column;gap:3px;min-width:0}
.rl-ai .sk-th .tt b{font-size:15px;font-weight:800;color:var(--ink)}
.rl-ai .sk-th .tt>span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink3)}
.rl-ai .sk-th select.ai-in{width:auto;height:28px;padding:0 24px 0 9px;border:0;border-radius:999px;font:inherit;font-size:12px!important;font-weight:700;color:var(--ink);background-color:#fff;box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .sk-tdirty{display:flex;align-items:center;gap:8px;padding:9px 18px;font-size:12px;font-weight:600;color:var(--wt);background:var(--wbg)}
.rl-ai .sk-tb{display:flex;flex-direction:column;gap:12px;min-height:380px;max-height:560px;overflow-y:auto;padding:18px;background:var(--paper)}
.rl-ai .sk-tempty{margin:auto;max-width:32ch;text-align:center;color:var(--ink3)}
.rl-ai .sk-tempty .rl-ic{display:block;margin:0 auto 8px;color:var(--ink4)}
.rl-ai .sk-tempty b{display:block;font-size:13.5px;color:var(--ink2)}
.rl-ai .sk-tempty span{display:block;margin-top:4px;font-size:12.5px;line-height:1.6}
.rl-ai .sk-bub{max-width:82%;padding:10px 14px;font-size:13.5px;line-height:1.5;white-space:pre-wrap;color:var(--ink)}
.rl-ai .sk-bub.cu{align-self:flex-end;border-radius:16px 16px 4px 16px;background:var(--p3)}
.rl-ai .sk-say{display:flex;align-items:flex-end;gap:8px;max-width:92%}
.rl-ai .sk-say .av{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center}
.rl-ai .sk-bub.ag{max-width:none;border-radius:16px 16px 16px 4px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .sk-bub.is-busy{display:flex;gap:4px;padding:14px}
.rl-ai .sk-bub.is-busy i{width:6px;height:6px;border-radius:50%;background:var(--ink4);animation:skDot 1s infinite}
.rl-ai .sk-bub.is-busy i:nth-child(2){animation-delay:.15s}
.rl-ai .sk-bub.is-busy i:nth-child(3){animation-delay:.3s}
@keyframes skDot{0%,80%,100%{opacity:.3}40%{opacity:1}}
.rl-ai .sk-used{display:flex;align-items:center;gap:7px;padding-left:34px;font-size:12px;line-height:1.4;color:var(--ink3)}
.rl-ai .sk-used .rl-ic{flex:none;color:var(--acc)}
.rl-ai .sk-used b{color:var(--ink2);font-weight:700}
.rl-ai .sk-tin{display:flex;align-items:center;gap:8px;padding:14px 16px 8px;border-top:1px solid var(--line)}
.rl-ai .sk-tin input{flex:1;min-width:0;height:42px;min-height:0!important;box-sizing:border-box;padding:0 14px!important;border:0!important;border-radius:12px;outline:0;background:#fff!important;box-shadow:inset 0 0 0 1px var(--line2)!important;font:inherit;font-size:13.5px!important;color:var(--ink)}
.rl-ai .sk-tin input:disabled{background:var(--paper)!important}
.rl-ai .sk-send{flex:none;width:42px;height:42px;border:0;border-radius:12px;display:grid;place-items:center;cursor:pointer;color:#fff;background:var(--acc)}
.rl-ai .sk-send[disabled]{cursor:default;color:var(--ink4);background:var(--p3)}
.rl-ai .sk-tnote{display:block;padding:0 16px 14px;font-size:12px;line-height:1.5;color:var(--ink3)}
.rl-ai .sk-rule{display:flex;gap:12px;padding:16px 18px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink3)}
.rl-ai .sk-rule .rl-ic{flex:none;margin-top:1px}
.rl-ai .sk-rule>div{display:flex;flex-direction:column;gap:4px}
.rl-ai .sk-rule b{font-size:13px;font-weight:800;color:var(--ink)}
.rl-ai .sk-rule span{font-size:12.5px;line-height:1.55;color:var(--ink2)}

@media (max-width: 1240px){
  .rl-ai .sk-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .rl-ai .sk-newc.span-3,.rl-ai .sk-newc.span-4{grid-column:1 / -1}
  .rl-ai .sk-cols{grid-template-columns:minmax(0,1fr) 360px}
}
@media (max-width: 1040px){
  .rl-ai .sk-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rl-ai .sk-newc{grid-column:1 / -1;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)}
  .rl-ai .sk-newc.span-1{grid-column:1 / -1;grid-template-columns:minmax(0,1fr)}
  .rl-ai .sk-strip{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .rl-ai .sk-strip .c.is-wait{grid-column:1 / -1;order:3;border-left:0;border-top:1px solid var(--line)}
  .rl-ai .sk-cols{grid-template-columns:minmax(0,1fr)}
  .rl-ai .sk-side{position:static}
}
@media (max-width: 860px){
  .rl-ai .sk-head{gap:12px;padding-top:20px}
  .rl-ai .sk-head .ai-h1{font-size:30px}
  .rl-ai .sk-head p{font-size:13.5px}
  /* the button keeps its words for a screen reader; the eye gets the plus */
  .rl-ai .rl-btn.sk-create{position:relative;width:42px;padding:0;justify-content:center;gap:0}
  .rl-ai .rl-btn.sk-create span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .rl-ai .sk-strip{grid-template-columns:minmax(0,1fr)}
  .rl-ai .sk-strip .c+.c{border-left:0;border-top:1px solid var(--line)}
  .rl-ai .sk-strip .c.is-wait{order:0}
  .rl-ai .sk-bar{flex-wrap:wrap}
  .rl-ai .sk-bar .sp{display:none}
  .rl-ai .ai-filter.sk-tabs{max-width:100%;margin-right:0;padding-right:4px;overflow-x:auto}
  .rl-ai .sk-search{width:100%}
  .rl-ai .sk-grid{grid-template-columns:minmax(0,1fr)}
  .rl-ai .sk-newc,.rl-ai .sk-newc.span-3,.rl-ai .sk-newc.span-4{grid-template-columns:minmax(0,1fr)}
  .rl-ai .sk-bhead .ai-h1{font-size:24px}
  .rl-ai .sk-steps{grid-template-columns:minmax(0,1fr)}
  .rl-ai .sk-fld{padding:18px}
  .rl-ai .sk-agents{grid-template-columns:minmax(0,1fr)}
  .rl-ai .sk-bfoot{padding:16px 18px}
  .rl-ai .sk-bfoot .rl-btn{flex:1;justify-content:center}
  .rl-ai .sk-vars .sp{display:none}
}

/* ═══ One goal, redesigned (2026-09-23, the "Goal redesign" canvas) ════════
   Light only. The goal's own header (crumb, label, title, chips, the black
   Replan at the top right), then target and pace beside the CMO's read, what
   waits for a person, where people drop beside this week, the plan, and the
   changes approved. Renderer: goalCardHtml in index.html. */
.rl-ai .gd-page{--wt:#8f5406;--wbg:#fcf3e2;--wl:#f1dcb2;--wd:#c27409;--okbg:#e8f4ec;--okt:#15703f;--acct:#b93520;--accl:#f8d5ca;--p3:#ebe8e1;--dt:#a8232e;--dbg:#fcecec;--it:#2b5bc4;--ibg:#edf2fd;--mono:"DM Mono",ui-monospace,monospace;
  display:flex;flex-direction:column;gap:22px;padding-bottom:30px}
/* A goal opened: its own header replaces the list's. */
.rl-ai .ai-goalsv:has(.gd-page) > .ai-phead{display:none}
.rl-ai .ai-goalsv:has(.gd-page) .ai-goalsbody{margin-top:0}
.rl-ai .gd-crumb{display:flex;align-items:center;gap:12px;padding-top:26px}
.rl-ai .gd-crumb .sp{flex:1}
.rl-ai .gd-back{display:inline-flex;align-items:center;gap:6px;height:32px;margin-left:-8px;padding:0 12px 0 8px;border:0;border-radius:9px;background:none;cursor:pointer;font:inherit;font-size:13.5px;font-weight:700;color:var(--ink2)}
.rl-ai .gd-back:hover{color:var(--ink);background:rgba(27,26,23,.05)}
.rl-ai .gd-meta{font-size:12.5px;color:var(--ink3)}
.rl-ai .gd-head{display:flex;align-items:flex-start;gap:28px}
.rl-ai .gd-head .tx{flex:1;min-width:0;max-width:720px;display:flex;flex-direction:column;gap:12px}
.rl-ai .gd-kick{display:flex;align-items:center;gap:10px}
.rl-ai .gd-page em{font-style:normal;font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
.rl-ai .gd-head .ai-h1{font-size:40px;line-height:1.08;text-wrap:balance}
.rl-ai .gd-head p{margin:0;font-size:15px;line-height:1.6;color:var(--ink2)}
.rl-ai .gd-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.rl-ai .gd-chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px;border-radius:999px;font-size:12.5px;font-weight:600;white-space:nowrap;color:var(--ink2);background:#fff;box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .gd-chip .rl-ic{color:var(--ink3)}
.rl-ai .gd-chip.is-ok{color:var(--okt);background:var(--okbg);box-shadow:none}
.rl-ai .gd-acts{flex:none;display:flex;align-items:center;gap:8px}
.rl-ai .gd-acts .rl-btn{height:40px;padding:0 15px;border-radius:12px;font-size:13px;font-weight:700}
.rl-ai .gd-acts .gd-del{width:40px;padding:0;justify-content:center;color:var(--dt)}
.rl-ai .gd-pill{display:inline-flex;align-items:center;gap:6px;flex:none;height:26px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;color:var(--ink2);background:var(--paper2)}
.rl-ai .gd-pill i{flex:none;width:6px;height:6px;border-radius:50%;background:var(--ink4)}
.rl-ai .gd-pill.is-ok{color:var(--okt);background:var(--okbg)}
.rl-ai .gd-pill.is-ok i{background:var(--ok)}
.rl-ai .gd-pill.is-acc{color:var(--acct);background:var(--acc-soft)}
.rl-ai .gd-pill.is-acc i{background:var(--acc)}
.rl-ai .gd-pill.is-warn{color:var(--wt);background:var(--wbg)}
.rl-ai .gd-pill.is-warn i{background:var(--wd)}
.rl-ai .gd-pill.is-danger{color:var(--dt);background:var(--dbg)}
.rl-ai .gd-pill.is-danger i{background:var(--dt)}
.rl-ai .gd-pill.is-info{color:var(--it);background:var(--ibg)}
.rl-ai .gd-pill.is-info i{background:var(--it)}

/* target and pace, beside the read */
.rl-ai .gd-hero{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,1fr);gap:18px;align-items:stretch}
.rl-ai .gd-card{display:flex;flex-direction:column;gap:18px;min-width:0;padding:24px 26px;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .gd-row{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 10px}
.rl-ai .gd-row .sp{flex:1}
.rl-ai .gd-when{font-size:12.5px;font-weight:600;color:var(--ink2)}
.rl-ai .gd-link{padding:0;border:0;background:none;cursor:pointer;font:inherit;font-size:12.5px;font-weight:700;color:var(--acct)}
.rl-ai .gd-link:hover{text-decoration:underline}
.rl-ai .gd-big{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 12px}
.rl-ai .gd-big b{font-family:var(--serif);font-size:72px;font-weight:500;line-height:.9;letter-spacing:-.03em;font-variant-numeric:tabular-nums;color:var(--ink)}
.rl-ai .gd-big>span:not(.sp){font-size:18px;font-weight:600;color:var(--ink3)}
.rl-ai .gd-big small{font-size:13px;font-weight:600;color:var(--okt)}
.rl-ai .gd-big .sp{flex:1}
.rl-ai .gd-big strong{font-family:var(--serif);font-size:28px;font-weight:500;color:var(--acct)}
.rl-ai .gd-bar{position:relative;height:12px;border-radius:999px;background:var(--p3)}
.rl-ai .gd-bar .f{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:linear-gradient(90deg,#f7876f,var(--acc))}
.rl-ai .gd-bar .tick{position:absolute;top:-6px;width:2px;height:24px;margin-left:-1px;border-radius:2px;background:var(--ink)}
.rl-ai .gd-tickrow{position:relative;height:16px;margin-top:-10px}
.rl-ai .gd-tickrow .tl{position:absolute;top:0;transform:translateX(-50%);font-size:11.5px;font-weight:700;white-space:nowrap;color:var(--ink2)}
.rl-ai .gd-tickrow .tl.is-end{transform:translateX(-100%)}
.rl-ai .gd-tickrow .tl.is-start{transform:none}
.rl-ai .gd-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr))}
.rl-ai .gd-stats>div{display:flex;flex-direction:column;gap:4px;min-width:0;padding:2px 16px}
.rl-ai .gd-stats>div:first-child{padding-left:0}
.rl-ai .gd-stats>div+div{border-left:1px solid var(--line)}
.rl-ai .gd-stats b{font-size:20px;font-weight:800;letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--ink)}
.rl-ai .gd-stats span{font-size:12px;line-height:1.4;color:var(--ink3)}
.rl-ai .gd-stats .is-warn b,.rl-ai .gd-stats .is-warn span{color:var(--wt)}
.rl-ai .gd-verdict{display:flex;gap:10px;padding:12px 14px;border-radius:14px;font-size:13px;line-height:1.5;font-weight:600}
.rl-ai .gd-verdict .rl-ic{flex:none;margin-top:1px}
.rl-ai .gd-verdict.is-warn{color:var(--wt);background:var(--wbg);box-shadow:inset 0 0 0 1px var(--wl)}
.rl-ai .gd-verdict.is-ok{color:var(--okt);background:var(--okbg)}
.rl-ai .gd-verdict.is-calm{color:var(--ink2);background:var(--paper)}
.rl-ai .gd-lead{margin:0;font-size:13.5px;line-height:1.6;color:var(--ink2)}
.rl-ai .gd-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rl-ai .gd-form label{display:flex;flex-direction:column;gap:6px;min-width:0;font-size:12px;font-weight:700;color:var(--ink2)}
.rl-ai .gd-form input,.rl-ai .gd-form select{width:100%;height:42px;min-height:0!important;box-sizing:border-box;padding:0 12px!important;border:0!important;border-radius:11px;outline:0;background:#fff!important;box-shadow:inset 0 0 0 1px var(--line2)!important;font:inherit;font-size:13.5px!important;font-weight:500;color:var(--ink)}
.rl-ai .gd-form input:focus,.rl-ai .gd-form select:focus{box-shadow:inset 0 0 0 1.5px #c9c4b9!important}
.rl-ai .gd-hint{max-width:46ch;font-size:12px;line-height:1.5;color:var(--ink3)}
.rl-ai .gd-target.is-empty .rl-btn{height:40px;padding:0 16px;border-radius:12px;font-weight:700}

/* the CMO's read */
.rl-ai .gd-rhd{display:flex;align-items:center;gap:12px}
.rl-ai .gd-rhd .ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:var(--acc);background:var(--acc-soft)}
.rl-ai .gd-rhd b{display:block;font-size:14.5px;font-weight:800;color:var(--ink)}
.rl-ai .gd-rhd small{display:block;margin-top:2px;font-size:12px;color:var(--ink3)}
.rl-ai .gd-rtxt{margin:0;font-family:var(--serif);font-size:19px;line-height:1.5;color:var(--ink);text-wrap:pretty}
.rl-ai .gd-adjs{display:flex;flex-direction:column;gap:12px;padding-top:16px;border-top:1px solid var(--line)}
.rl-ai .gd-adj{display:flex;gap:12px}
.rl-ai .gd-adj+.gd-adj{padding-top:12px;border-top:1px dashed var(--line)}
.rl-ai .gd-adj .ic{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;color:var(--ink);background:var(--paper2)}
.rl-ai .gd-adj .b{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.rl-ai .gd-adj .b>b{font-size:14px;font-weight:800;color:var(--ink)}
.rl-ai .gd-adj .w{font-size:12.5px;line-height:1.5;color:var(--ink2)}
.rl-ai .gd-adj .ft{display:inline-flex;align-items:center;flex-wrap:wrap;gap:6px;color:var(--ink3)}
.rl-ai .gd-adj .ft s,.rl-ai .gd-adj .ft i{padding:3px 8px;border-radius:7px;font-style:normal;font-family:var(--mono);font-size:12px}
.rl-ai .gd-adj .ft s{color:var(--ink3);background:var(--paper2)}
.rl-ai .gd-adj .ft i{color:var(--acct);background:var(--acc-soft)}
.rl-ai .gd-adj small{font-size:11.5px;color:var(--ink3)}
.rl-ai .gd-adj .a{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.rl-ai .gd-adj .rl-btn{height:34px;padding:0 13px;border-radius:10px;font-size:12.5px;font-weight:700}
.rl-ai .rl-btn.gd-do{color:#fff;background:var(--acc);box-shadow:0 8px 18px -10px rgba(217,72,47,.7)}
.rl-ai .rl-btn.gd-do:hover{color:#fff;background:var(--acc2)}

/* what waits for a person */
.rl-ai .gd-sec{display:flex;flex-direction:column;gap:14px}
.rl-ai .gd-shd{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-top:10px}
.rl-ai .gd-shd h2{margin:0;font-size:19px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.rl-ai .gd-shd .n{display:inline-grid;place-items:center;min-width:24px;height:24px;box-sizing:border-box;padding:0 7px;border-radius:999px;font-size:12px;font-weight:800;color:#fff;background:var(--acc)}
.rl-ai .gd-shd .s{font-size:13.5px;color:var(--ink3)}
.rl-ai .gd-waits{display:flex;flex-direction:column;gap:12px}
.rl-ai .gd-wait{display:flex;align-items:flex-start;gap:16px;padding:20px 22px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1px var(--accl),0 14px 30px -24px rgba(217,72,47,.55)}
.rl-ai .gd-wait.is-staged{box-shadow:inset 0 0 0 1px var(--line2),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .gd-k{flex:none;width:44px;height:44px;border-radius:13px;display:grid;place-items:center}
.rl-ai .gd-k.k-campaign{color:#c0341d;background:#fde7e1}
.rl-ai .gd-k.k-journey{color:#3f6bb0;background:#eaf1fb}
.rl-ai .gd-k.k-template{color:#0d7a70;background:#d7f2ee}
.rl-ai .gd-k.k-knowledge{color:#6b3fa0;background:#f3ecfb}
.rl-ai .gd-k.k-delegate{color:#a16207;background:#fdf1dc}
.rl-ai .gd-wait .b{flex:1;min-width:0;display:flex;flex-direction:column;gap:7px}
.rl-ai .gd-wait .t{display:flex;align-items:center;flex-wrap:wrap;gap:4px 10px}
.rl-ai .gd-wait .t b{font-size:15px;font-weight:800;letter-spacing:-.005em;color:var(--ink)}
.rl-ai .gd-wait .t em{color:var(--ink4)}
.rl-ai .gd-wait p{margin:0;font-size:13.5px;line-height:1.55;color:var(--ink2)}
.rl-ai .gd-wait p strong{font-weight:700;color:var(--ink)}
.rl-ai .gd-dl{display:flex;align-items:flex-start;gap:8px;font-size:12.5px;line-height:1.5;color:var(--ink2)}
.rl-ai .gd-dl .rl-ic{flex:none;margin-top:2px;color:#a16207}
.rl-ai .gd-dl b{color:var(--ink)}
.rl-ai .gd-wait .a{flex:none;display:flex;gap:8px;padding-top:2px}
.rl-ai .gd-wait .a .rl-btn{height:38px;padding:0 14px;border-radius:11px;font-size:13px;font-weight:700}

/* where people drop, beside this week */
.rl-ai .gd-two{display:grid;grid-template-columns:minmax(0,1.32fr) minmax(0,1fr);gap:18px;align-items:stretch;margin-top:10px}
.rl-ai .gd-chd{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px}
.rl-ai .gd-chd h3{margin:0;font-size:16px;font-weight:800;color:var(--ink)}
.rl-ai .gd-chd span{font-size:12.5px;color:var(--ink3)}
.rl-ai .gd-frs{display:flex;flex-direction:column;gap:8px}
.rl-ai .gd-fr{display:grid;grid-template-columns:96px minmax(0,1fr) 92px;align-items:center;gap:12px}
.rl-ai .gd-fr .l{overflow:hidden;font-size:13px;font-weight:600;white-space:nowrap;text-overflow:ellipsis;color:var(--ink2)}
.rl-ai .gd-fr .t{position:relative;height:26px;border-radius:8px;overflow:hidden;background:var(--paper2)}
.rl-ai .gd-fr .t i{position:absolute;left:0;top:0;bottom:0;border-radius:8px;background:var(--acc)}
.rl-ai .gd-fr .v{text-align:right;font-size:12.5px;white-space:nowrap;font-variant-numeric:tabular-nums;color:var(--ink3)}
.rl-ai .gd-fr .v b{font-size:13.5px;font-weight:800;color:var(--ink)}
.rl-ai .gd-fd{display:flex;align-items:center;gap:5px;padding-left:108px;font-size:11.5px;color:var(--ink3)}
.rl-ai .gd-fd .rl-ic{color:var(--ink4)}
.rl-ai .gd-fd.is-worst{align-self:flex-start;height:24px;margin-left:108px;padding:0 9px;border-radius:999px;font-weight:800;color:var(--wt);background:var(--wbg)}
.rl-ai .gd-fd.is-worst .rl-ic{color:var(--wt)}
.rl-ai .gd-wk{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.rl-ai .gd-wk>div{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:16px;background:var(--paper)}
.rl-ai .gd-wk b{font-family:var(--serif);font-size:38px;font-weight:500;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.rl-ai .gd-wk span{font-size:12.5px;font-weight:600;color:var(--ink3)}
.rl-ai .gd-wl{display:flex;flex-direction:column}
.rl-ai .gd-wl>div{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;column-gap:12px;padding:10px 2px;border-top:1px solid var(--line)}
.rl-ai .gd-wl span{font-size:13px;font-weight:600;color:var(--ink2)}
.rl-ai .gd-wl b{text-align:right;font-size:15px;font-weight:800;font-variant-numeric:tabular-nums;color:var(--ink)}
.rl-ai .gd-wl small{grid-column:1 / -1;font-size:11.5px;color:var(--ink3)}

/* the plan, and what changed */
.rl-ai .gd-plan{display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .gd-plan .gl{padding:14px 20px 10px;font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
.rl-ai .gd-plan .gd-pr ~ .gl{border-top:1px solid var(--line)}
.rl-ai .gd-pr{display:flex;align-items:center;gap:14px;padding:13px 20px;border-top:1px solid var(--line)}
.rl-ai .gd-pr:hover{background:#fdfcfa}
.rl-ai .gd-pr.is-skip{opacity:.7}
.rl-ai .gd-pr .gd-k{width:38px;height:38px;border-radius:11px}
.rl-ai .gd-pr .b{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.rl-ai .gd-pr .b b{font-size:14px;font-weight:800;color:var(--ink)}
.rl-ai .gd-pr .b span{overflow:hidden;font-size:12.5px;line-height:1.45;white-space:nowrap;text-overflow:ellipsis;color:var(--ink3)}
.rl-ai .gd-pr .gd-pill{height:24px;max-width:300px;overflow:hidden;font-size:11.5px;text-overflow:ellipsis}
.rl-ai .gd-nodata{display:flex;align-items:center;gap:10px;padding:18px 20px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font-size:13.5px;line-height:1.5;color:var(--ink2)}
.rl-ai .gd-nodata .rl-ic{flex:none;color:var(--ink4)}
.rl-ai .gd-journal{gap:6px}
.rl-ai .gd-jr{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;padding:11px 0;border-top:1px solid var(--line)}
.rl-ai .gd-jr:first-of-type{margin-top:8px}
.rl-ai .gd-jr .ic{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;color:var(--ink2);background:var(--paper2)}
.rl-ai .gd-jr b{font-size:13.5px;font-weight:700;color:var(--ink)}
.rl-ai .gd-jr .ft{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:12px;color:var(--ink3)}
.rl-ai .gd-jr .ft i{font-style:normal;color:var(--ink)}
.rl-ai .gd-jr .sp{flex:1}
.rl-ai .gd-jr small{font-size:12px;color:var(--ink3)}

@media (max-width: 1040px){
  .rl-ai .gd-hero,.rl-ai .gd-two{grid-template-columns:minmax(0,1fr)}
  .rl-ai .gd-head{flex-direction:column;gap:16px}
}
@media (max-width: 860px){
  .rl-ai .gd-crumb{padding-top:14px}
  .rl-ai .gd-meta{display:none}
  .rl-ai .gd-head .ai-h1{font-size:28px}
  .rl-ai .gd-head p{font-size:13.5px}
  .rl-ai .gd-acts{flex-wrap:wrap;width:100%}
  .rl-ai .gd-acts .rl-btn:first-child{flex:1 1 100%;justify-content:center}
  .rl-ai .gd-acts .rl-btn:nth-child(2){flex:1;justify-content:center}
  .rl-ai .gd-card{padding:20px 18px}
  .rl-ai .gd-big b{font-size:54px}
  .rl-ai .gd-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .rl-ai .gd-stats>div,.rl-ai .gd-stats>div:first-child{padding:12px;border-left:0;border-radius:14px;background:var(--paper)}
  .rl-ai .gd-stats>div.is-warn{background:var(--wbg)}
  .rl-ai .gd-form{grid-template-columns:minmax(0,1fr)}
  .rl-ai .gd-rtxt{font-size:17px}
  .rl-ai .gd-wait{flex-wrap:wrap;padding:16px}
  .rl-ai .gd-wait .b{flex:1 1 calc(100% - 60px)}
  .rl-ai .gd-wait .a{width:100%}
  .rl-ai .gd-wait .a .rl-btn:first-child{flex:1;justify-content:center}
  .rl-ai .gd-fr{grid-template-columns:78px minmax(0,1fr) 76px;gap:10px}
  .rl-ai .gd-fd{padding-left:88px}
  .rl-ai .gd-fd.is-worst{margin-left:88px;padding:0 9px}
  .rl-ai .gd-pr{align-items:flex-start;flex-wrap:wrap;padding:13px 14px}
  .rl-ai .gd-pr .b{flex:1 1 calc(100% - 52px)}
  .rl-ai .gd-pr .b span{white-space:normal}
  .rl-ai .gd-pr .gd-pill{max-width:calc(100% - 52px);margin-left:52px}
}

/* ═══ The Brain, redesigned (2026-09-23, the "Brain redesign" canvas) ═════
   Light only. The index opens on how much it knows and the one next thing to
   teach; then the questions customers asked that it could not answer, the
   sections as cards that show their own words, knowledge, and a practice
   chat beside them. A section is one step, with the Brain as the agents read
   it alongside. The animated mark (above) now sits inside a progress ring. */
.rl-ai .bx-page,.rl-ai .bx-step,.rl-ai .bx-save{--wt:#8f5406;--wbg:#fcf3e2;--wl:#f1dcb2;--wd:#c27409;--okbg:#e8f4ec;--okt:#15703f;--acct:#b93520;--accl:#f8d5ca;--p3:#ebe8e1;--mono:"DM Mono",ui-monospace,monospace}
.rl-ai .bx-page em,.rl-ai .bx-step em{font-style:normal;font-family:var(--mono);font-size:10.5px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3)}
.rl-ai .bx-head{display:flex;align-items:flex-start;gap:24px;padding:34px 0 0}
.rl-ai .bx-head .tx{flex:1;min-width:0;max-width:660px}
.rl-ai .bx-head .ai-h1{font-size:40px;line-height:1.05}
.rl-ai .bx-head p{margin:12px 0 0;font-size:14.5px;line-height:1.6;color:var(--ink2)}
.rl-ai .bx-head .ai-hist{margin-top:6px}
.rl-ai .rl-btn.bx-draft{flex:none;margin-left:auto;height:42px;padding:0 18px;border-radius:12px;font-size:13.5px;font-weight:700}
.rl-ai .rl-btn.bx-pri{height:40px;padding:0 15px;border-radius:12px;font-size:13px;font-weight:700;color:#fff;background:var(--acc);box-shadow:0 8px 18px -10px rgba(217,72,47,.7)}
.rl-ai .rl-btn.bx-pri:hover{color:#fff;background:var(--acc2)}
.rl-ai .bx-pill{display:inline-flex;align-items:center;gap:6px;flex:none;height:24px;padding:0 10px;border-radius:999px;font-size:11.5px;font-weight:700;white-space:nowrap;color:var(--ink2);background:var(--paper2)}
.rl-ai .bx-pill i{width:6px;height:6px;border-radius:50%;background:var(--ink4)}
.rl-ai .bx-pill.is-done{color:var(--okt);background:var(--okbg)}
.rl-ai .bx-pill.is-done i{background:var(--ok)}
.rl-ai .bx-pill.is-part{color:var(--wt);background:var(--wbg)}
.rl-ai .bx-pill.is-part i{background:var(--wd)}

/* how much it knows, and the next thing to teach */
.rl-ai .bx-health{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);margin-top:26px;border-radius:24px;overflow:hidden;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .bx-health .l{display:flex;align-items:center;gap:26px;min-width:0;padding:26px 28px}
.rl-ai .bx-mark{position:relative;flex:none;width:132px;height:132px;display:grid;place-items:center}
.rl-ai .bx-mark .ai-gauge.is-ring{position:absolute;inset:0;width:100%;height:100%}
.rl-ai .bx-mark .ai-gauge.is-ring circle{stroke-width:2.6}
.rl-ai .bx-mark .ai-mind{transform:scale(1.12)}
.rl-ai .bx-sum{display:flex;flex-direction:column;gap:14px;min-width:0}
.rl-ai .bx-sum .bx-pct{display:flex;align-items:baseline;gap:10px}
.rl-ai .bx-sum .bx-pct b{font-family:var(--serif);font-size:46px;font-weight:500;line-height:1;letter-spacing:-.02em;color:var(--ink)}
.rl-ai .bx-sum .bx-pct span{font-size:15px;font-weight:600;color:var(--ink3)}
.rl-ai .bx-sum p{margin:0;font-family:var(--serif);font-size:18px;line-height:1.45;color:var(--ink);text-wrap:pretty}
.rl-ai .bx-sum p .acc{color:var(--acct)}
.rl-ai .bx-stats{display:grid;grid-template-columns:repeat(3,auto);justify-content:start}
.rl-ai .bx-stats>div{display:flex;flex-direction:column;gap:3px;min-width:0;padding:0 16px}
.rl-ai .bx-stats>div:first-child{padding-left:0}
.rl-ai .bx-stats>div+div{border-left:1px solid var(--line)}
.rl-ai .bx-stats span{display:flex;align-items:baseline;gap:5px}
.rl-ai .bx-stats b{font-size:22px;font-weight:800;letter-spacing:-.01em;font-variant-numeric:tabular-nums;color:var(--ink)}
.rl-ai .bx-stats i{font-style:normal;font-size:13px;font-weight:600;color:var(--ink3)}
.rl-ai .bx-stats small{font-size:12.5px;color:var(--ink3)}
.rl-ai .bx-health .r{display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0;padding:26px 28px;background:#fffaf8;border-left:1px solid var(--accl)}
.rl-ai .bx-health .r em{color:var(--acct)}
.rl-ai .bx-health .r .q{margin:0;font-family:var(--serif);font-size:21px;line-height:1.35;color:var(--ink);text-wrap:pretty}
.rl-ai .bx-health .r>span{font-size:13px;line-height:1.5;color:var(--ink2)}
.rl-ai .bx-health .r .rl-btn{margin-top:auto}

/* the columns */
.rl-ai .bx-cols{display:grid;grid-template-columns:minmax(0,1fr) 372px;gap:22px;align-items:start;margin-top:30px}
.rl-ai .bx-main{display:flex;flex-direction:column;gap:34px;min-width:0}
.rl-ai .bx-sec{display:flex;flex-direction:column;gap:14px;min-width:0}
.rl-ai .bx-sh{display:flex;align-items:flex-end;gap:12px}
.rl-ai .bx-sh .tt{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.rl-ai .bx-sh h2{display:flex;align-items:center;gap:10px;margin:0;font-size:19px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
.rl-ai .bx-sh h2 .n{display:inline-grid;place-items:center;min-width:24px;height:24px;box-sizing:border-box;padding:0 7px;border-radius:999px;font-size:12px;font-weight:800;color:#fff;background:var(--acc)}
.rl-ai .bx-sh .tt>span{font-size:13.5px;color:var(--ink3)}
.rl-ai .bx-sh .bx-shb{flex:none;display:flex;gap:8px}
.rl-ai .rl-btn.bx-go{flex:none;border:0;color:var(--acct);font-weight:700}
.rl-ai .rl-btn.bx-go:hover{color:#8f2816}
.rl-ai .bx-none{display:flex;align-items:center;gap:10px;padding:18px 20px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font-size:13.5px;line-height:1.5;color:var(--ink2)}
.rl-ai .bx-none .rl-ic{flex:none;color:var(--ok)}
.rl-ai .bx-more{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;height:46px;border:0;border-top:1px solid var(--line);background:none;cursor:pointer;font:inherit;font-size:13px;font-weight:700;color:var(--acct)}
.rl-ai .bx-gaps+.bx-more{border:0;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}

/* the questions it could not answer */
.rl-ai .bx-gaps{display:flex;flex-direction:column;gap:10px}
.rl-ai .bx-gap{display:flex;flex-direction:column;gap:14px;padding:18px 20px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .bx-gap.is-open{box-shadow:inset 0 0 0 1.5px var(--accl),0 16px 34px -26px rgba(217,72,47,.6)}
.rl-ai .bx-gap .r{display:flex;align-items:flex-start;gap:14px}
.rl-ai .bx-gap .ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:#2b5bc4;background:#edf2fd}
.rl-ai .bx-gap .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:5px}
.rl-ai .bx-gap .t p{margin:0;font-family:var(--serif);font-size:18px;line-height:1.35;color:var(--ink)}
.rl-ai .bx-gap .t span{font-size:12.5px;line-height:1.5;color:var(--ink3)}
.rl-ai .bx-gap .t b{font-weight:700;color:var(--ink2)}
.rl-ai .bx-gap .a{flex:none;display:flex;gap:6px}
.rl-ai .bx-gap .a .rl-btn{height:36px;padding:0 12px;border-radius:10px;font-weight:700}
.rl-ai .bx-gap .w{display:flex;flex-direction:column;gap:8px;margin-left:54px}
.rl-ai .bx-gap .w label{font-size:12.5px;font-weight:700;color:var(--ink2)}
.rl-ai .bx-gap .w textarea.ai-in{min-height:92px!important;font-size:14px!important}
.rl-ai .bx-gap .w .b{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.rl-ai .bx-gap .w .b>span{flex:1 1 220px;display:inline-flex;align-items:center;gap:6px;font-size:12px;line-height:1.45;color:var(--ink3)}
.rl-ai .bx-gap .w .b .rl-btn{height:38px;border-radius:11px;font-weight:700}

/* the sections, as cards that show their own words */
.rl-ai .bx-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rl-ai .bx-card{display:flex;flex-direction:column;align-items:stretch;gap:12px;min-width:0;padding:18px;border:0;border-radius:18px;cursor:pointer;font:inherit;text-align:left;color:var(--ink);background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04);transition:box-shadow .2s ease,transform .2s ease}
.rl-ai .bx-card:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px #d6d1c6,0 22px 40px -24px rgba(27,26,23,.32)}
.rl-ai .bx-card.is-empty{background:#fdfcfa}
.rl-ai .bx-card .top{display:flex;align-items:center;gap:12px}
.rl-ai .bx-card .ic{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;color:var(--acct);background:var(--acc-soft)}
.rl-ai .bx-card.is-empty .ic{color:var(--ink3);background:var(--paper2)}
.rl-ai .bx-card .top b{flex:1;min-width:0;font-size:15px;font-weight:800}
.rl-ai .bx-card .pv{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-family:var(--serif);font-size:15.5px;line-height:1.45;color:var(--ink2)}
.rl-ai .bx-card .pv.is-empty{font-family:inherit;font-size:13.5px;line-height:1.5;color:var(--ink3)}
.rl-ai .bx-card .ft{display:flex;align-items:center;gap:10px;margin-top:auto}
.rl-ai .bx-card .segs{display:flex;gap:3px;width:70px;flex:none}
.rl-ai .bx-card .segs i{flex:1;height:4px;border-radius:999px;background:var(--p3)}
.rl-ai .bx-card .segs i.is-ok{background:var(--ok)}
.rl-ai .bx-card .segs i.is-part{background:var(--wd)}
.rl-ai .bx-card .m{flex:1;min-width:0;overflow:hidden;font-size:12px;font-weight:600;white-space:nowrap;text-overflow:ellipsis;color:var(--ink3)}
.rl-ai .bx-card .m.is-miss{color:var(--wt)}
.rl-ai .bx-card .ft .rl-ic{flex:none;color:var(--ink4)}

/* knowledge */
.rl-ai .bx-kb{display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .bx-find{display:flex;align-items:center;gap:8px;height:40px;box-sizing:border-box;margin:14px 18px 6px;padding:0 12px;border-radius:11px;color:var(--ink3);background:var(--paper);box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .bx-find:focus-within{box-shadow:inset 0 0 0 1.5px #c9c4b9}
.rl-ai .bx-find input{flex:1;min-width:0;min-height:0!important;height:auto!important;padding:0!important;border:0!important;outline:0;background:none!important;box-shadow:none!important;font:inherit;font-size:13.5px!important;color:var(--ink)}
.rl-ai .bx-krow{display:flex;align-items:flex-start;gap:12px;padding:13px 14px 13px 18px}
.rl-ai .bx-krow+.bx-krow,.rl-ai .bx-find+div .bx-krow:first-child{border-top:1px solid var(--line)}
.rl-ai .bx-krow:hover{background:#fdfcfa}
.rl-ai .bx-krow .ic{flex:none;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;color:var(--ink2);background:var(--paper2)}
.rl-ai .bx-krow .t{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px;padding:0;border:0;background:none;cursor:pointer;font:inherit;text-align:left;color:var(--ink)}
.rl-ai .bx-krow .t b{font-size:14px;font-weight:700}
.rl-ai .bx-krow .t span{overflow:hidden;font-size:12.5px;line-height:1.5;white-space:nowrap;text-overflow:ellipsis;color:var(--ink3)}
.rl-ai .bx-krow .d{flex:none;padding-top:3px;font-size:12px;color:var(--ink4)}
.rl-ai .bx-kempty{display:flex;flex-direction:column;gap:4px;padding:18px 20px;font-size:13px;line-height:1.55;color:var(--ink3)}
.rl-ai .bx-kempty b{font-size:13.5px;color:var(--ink2)}

/* the side: try it, and who reads it */
.rl-ai .bx-side{position:sticky;top:16px;display:flex;flex-direction:column;gap:14px;min-width:0}
.rl-ai .bx-try{display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .bx-try .hd{display:flex;align-items:center;gap:12px;padding:16px 18px;border-bottom:1px solid var(--line)}
.rl-ai .bx-try .hd .ic,.rl-ai .bx-reads .hd .ic{flex:none;width:38px;height:38px;border-radius:12px;display:grid;place-items:center;color:var(--acc);background:var(--acc-soft)}
.rl-ai .bx-try .hd b,.rl-ai .bx-reads .hd b{display:block;font-size:15px;font-weight:800;color:var(--ink)}
.rl-ai .bx-try .hd small,.rl-ai .bx-reads .hd small{display:block;margin-top:2px;font-size:12px;color:var(--ink3)}
.rl-ai .bx-try .hd .sp{flex:1}
.rl-ai .bx-try .bd{display:flex;flex-direction:column;gap:10px;min-height:260px;max-height:460px;overflow-y:auto;padding:16px;background:var(--paper)}
.rl-ai .bx-tempty{display:flex;flex-direction:column;align-items:center;gap:4px;margin:auto;max-width:30ch;text-align:center;color:var(--ink3)}
.rl-ai .bx-tempty .rl-ic{color:var(--ink4);margin-bottom:4px}
.rl-ai .bx-tempty b{font-size:13.5px;color:var(--ink2)}
.rl-ai .bx-tempty span{font-size:12.5px;line-height:1.6}
.rl-ai .bx-tempty .rl-btn{margin-top:10px}
.rl-ai .bx-bub{max-width:84%;padding:10px 14px;font-size:13.5px;line-height:1.5;white-space:pre-wrap;color:var(--ink)}
.rl-ai .bx-bub.cu{align-self:flex-end;border-radius:16px 16px 4px 16px;background:var(--p3)}
.rl-ai .bx-say{display:flex;align-items:flex-end;gap:8px;max-width:94%}
.rl-ai .bx-say .av{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center}
.rl-ai .bx-bub.ag{max-width:none;border-radius:16px 16px 16px 4px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .bx-bub.is-busy{display:flex;gap:4px;padding:14px}
.rl-ai .bx-bub.is-busy i{width:6px;height:6px;border-radius:50%;background:var(--ink4);animation:skDot 1s infinite}
.rl-ai .bx-bub.is-busy i:nth-child(2){animation-delay:.15s}
.rl-ai .bx-bub.is-busy i:nth-child(3){animation-delay:.3s}
.rl-ai .bx-used{display:flex;align-items:center;gap:7px;padding-left:34px;font-size:12px;line-height:1.4;color:var(--ink3)}
.rl-ai .bx-used .rl-ic{flex:none}
.rl-ai .bx-used.is-ok .rl-ic{color:var(--ok)}
.rl-ai .bx-used.is-warn{color:var(--wt)}
.rl-ai .bx-used.is-warn .rl-ic{color:var(--wd)}
.rl-ai .bx-teach{align-self:flex-start;display:inline-flex;align-items:center;gap:7px;height:32px;margin-left:34px;padding:0 12px;border:0;border-radius:10px;cursor:pointer;font:inherit;font-size:12.5px;font-weight:700;color:var(--acct);background:#fffaf8;box-shadow:inset 0 0 0 1px var(--accl)}
.rl-ai .bx-teach:hover{background:var(--acc-soft)}
.rl-ai .bx-try .in{display:flex;align-items:center;gap:8px;padding:14px 16px 8px;border-top:1px solid var(--line)}
.rl-ai .bx-try .in input{flex:1;min-width:0;height:42px;min-height:0!important;box-sizing:border-box;padding:0 14px!important;border:0!important;border-radius:12px;outline:0;background:#fff!important;box-shadow:inset 0 0 0 1px var(--line2)!important;font:inherit;font-size:13.5px!important;color:var(--ink)}
.rl-ai .bx-try .in input:disabled{background:var(--paper)!important}
.rl-ai .bx-send{flex:none;width:42px;height:42px;border:0;border-radius:12px;display:grid;place-items:center;cursor:pointer;color:#fff;background:var(--acc)}
.rl-ai .bx-send[disabled]{cursor:default;color:var(--ink4);background:var(--p3)}
.rl-ai .bx-try .nt{display:block;padding:0 16px 14px;font-size:12px;line-height:1.5;color:var(--ink3)}
.rl-ai .bx-who{display:flex;flex-direction:column;gap:10px;padding:18px;border-radius:20px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .bx-who>span{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--ink2)}
.rl-ai .bx-who>span .rl-ic{flex:none;color:var(--ink3)}
.rl-ai .bx-who small{font-size:12px;line-height:1.5;color:var(--ink3)}
.rl-ai .bx-who .ft{display:flex;align-items:center;flex-wrap:wrap;gap:6px 12px;padding-top:10px;border-top:1px solid var(--line)}

/* one step */
.rl-ai .bx-shead{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:28px 0 0}
.rl-ai .bx-shead .vr{width:1px;height:22px;background:var(--line2)}
.rl-ai .bx-shead .av{flex:none;width:42px;height:42px;border-radius:13px;display:grid;place-items:center;color:var(--acct);background:var(--acc-soft)}
.rl-ai .bx-shead .tx{min-width:0}
.rl-ai .bx-shead .ai-h1{font-size:30px}
.rl-ai .bx-shead p{margin:3px 0 0;font-size:13.5px;color:var(--ink3)}
.rl-ai .bx-shead .sp{flex:1}
.rl-ai .bx-stepper{list-style:none;display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:4px;margin:22px 0 0;padding:6px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .bx-stepper button{display:flex;flex-direction:column;align-items:center;gap:7px;width:100%;padding:10px 4px;border:0;border-radius:12px;background:none;cursor:pointer;font:inherit;color:var(--ink)}
.rl-ai .bx-stepper button:hover{background:var(--paper)}
.rl-ai .bx-stepper button.is-here{background:#fffaf8;box-shadow:inset 0 0 0 1px var(--accl)}
.rl-ai .bx-stepper .n{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;color:var(--ink3);background:var(--p3)}
.rl-ai .bx-stepper .is-done .n{color:#fff;background:var(--ok)}
.rl-ai .bx-stepper .is-part .n{color:var(--wt);background:var(--wbg);box-shadow:inset 0 0 0 1.5px var(--wd)}
.rl-ai .bx-stepper .is-here .n{color:#fff;background:var(--acc);box-shadow:0 0 0 4px var(--acc-soft)}
.rl-ai .bx-stepper .l{font-size:12px;font-weight:600;line-height:1.25;text-align:center;color:var(--ink3)}
.rl-ai .bx-stepper .is-here .l{font-weight:800;color:var(--ink)}
.rl-ai .bx-scols{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:20px;align-items:start;margin-top:20px}
.rl-ai .bx-form{display:flex;flex-direction:column;min-width:0;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px var(--line),0 1px 2px rgba(27,26,23,.04)}
.rl-ai .bx-form .ai-form{gap:0}
.rl-ai .bx-form .ai-fld{padding:22px 26px}
.rl-ai .bx-form .ai-fld+.ai-fld{border-top:1px solid var(--line)}
.rl-ai .bx-form .ai-fld label{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 10px;margin-bottom:12px;font-size:14px;font-weight:800}
.rl-ai .bx-form .ai-fld label span{display:inline;margin:0;font-size:12.5px}
.rl-ai .bx-form input.ai-in{height:46px;padding:0 14px;border-radius:12px;font-size:14.5px!important}
.rl-ai .bx-form textarea.ai-in{min-height:112px!important;padding:12px 14px;border-radius:12px;font-size:14.5px!important;line-height:1.6}
.rl-ai .bx-form .ai-stepbar{margin:0;padding:16px 26px;border-top:1px solid var(--line);border-radius:0 0 22px 22px;background:var(--paper)}
.rl-ai .bx-form .ai-stepbar .rl-btn{height:40px;padding:0 15px;border-radius:12px;font-weight:700}
.rl-ai .bx-hide{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden;clip:rect(0 0 0 0);opacity:0;pointer-events:none}
.rl-ai .bx-picks{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.rl-ai .bx-picks button{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 13px;border:0;border-radius:999px;cursor:pointer;font:inherit;font-size:13px;font-weight:600;color:var(--ink2);background:#fff;box-shadow:inset 0 0 0 1px var(--line2)}
.rl-ai .bx-picks button .rl-ic{color:var(--ink3)}
.rl-ai .bx-picks button:hover{box-shadow:inset 0 0 0 1px #c9c4b9}
.rl-ai .bx-picks button.is-on{color:#fff;background:var(--ink);box-shadow:none}
.rl-ai .bx-picks button.is-on .rl-ic{display:none}
.rl-ai .bx-seg{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:13px;background:var(--paper2);box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .bx-seg button{display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-width:108px;padding:8px 14px;border:0;border-radius:10px;background:none;cursor:pointer;font:inherit;text-align:left}
.rl-ai .bx-seg b{font-size:13.5px;font-weight:700;color:var(--ink2)}
.rl-ai .bx-seg small{font-size:11.5px;color:var(--ink3)}
.rl-ai .bx-seg button.is-on{background:#fff;box-shadow:0 1px 2px rgba(27,26,23,.08),inset 0 0 0 1px var(--line)}
.rl-ai .bx-seg button.is-on b{color:var(--ink)}
.rl-ai .bx-side2{position:sticky;top:16px;display:flex;flex-direction:column;gap:14px;min-width:0}
.rl-ai .bx-reads{display:flex;flex-direction:column;gap:12px;padding:18px;border-radius:22px;background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.rl-ai .bx-reads .hd{display:flex;align-items:center;gap:10px}
.rl-ai .bx-reads .hd .ic{color:var(--ink2);background:var(--paper2)}
.rl-ai .bx-reads .ln{display:grid;grid-template-columns:104px minmax(0,1fr);gap:10px;padding:8px 10px;border-radius:10px}
.rl-ai .bx-reads .ln.is-on{background:#fffaf8;box-shadow:inset 0 0 0 1px var(--accl)}
.rl-ai .bx-reads .ln em{padding-top:2px;font-size:10.5px;letter-spacing:.06em}
.rl-ai .bx-reads .ln.is-on em{color:var(--acct)}
.rl-ai .bx-reads .ln span{font-size:13px;line-height:1.5;overflow-wrap:anywhere;color:var(--ink)}
.rl-ai .bx-reads .ln span.is-empty{color:var(--ink4)}
.rl-ai .bx-tip{display:flex;gap:12px;padding:16px 18px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1px var(--line);font-size:12.5px;line-height:1.55;color:var(--ink2)}
.rl-ai .bx-tip .rl-ic{flex:none;margin-top:1px;color:var(--ink3)}
.rl-ai .bx-kbstep{margin-top:20px}
.rl-ai .bx-kbstep .bx-kb{margin-top:14px}
.rl-ai .bx-kbstep .bx-krow+.bx-krow{border-top:1px solid var(--line)}
.rl-ai .bx-kbstep .ai-stepbar{margin-top:22px}

/* the save bar, stuck to the bottom of the scrolling view */
.rl-ai .bx-save{position:sticky;bottom:12px;z-index:3;display:flex;align-items:center;flex-wrap:wrap;gap:10px 12px;width:calc(100% - 64px);max-width:1016px;box-sizing:border-box;margin:auto auto 12px;padding:12px 16px;border-radius:16px;background:#fff;box-shadow:inset 0 0 0 1px var(--wl),0 18px 36px -24px rgba(27,26,23,.4)}
.rl-ai .bx-save[hidden]{display:none}
.rl-ai .bx-save .st{display:inline-flex;align-items:center;gap:8px;font-size:13.5px;color:var(--ink2)}
.rl-ai .bx-save .st .rl-ic{flex:none;color:var(--wd)}
.rl-ai .bx-save .st b{color:var(--ink)}
.rl-ai .bx-save .sp{flex:1}
.rl-ai .bx-save .rl-btn{height:38px;padding:0 15px;border-radius:11px;font-weight:700}

@media (max-width: 1240px){
  .rl-ai .bx-cols{grid-template-columns:minmax(0,1fr) 330px}
  .rl-ai .bx-scols{grid-template-columns:minmax(0,1fr) 330px}
  .rl-ai .bx-stepper .l{font-size:11px}
}
@media (max-width: 1040px){
  .rl-ai .bx-health{grid-template-columns:minmax(0,1fr)}
  .rl-ai .bx-health .r{border-left:0;border-top:1px solid var(--accl)}
  .rl-ai .bx-cols,.rl-ai .bx-scols{grid-template-columns:minmax(0,1fr)}
  .rl-ai .bx-side,.rl-ai .bx-side2{position:static}
  .rl-ai .bx-stepper{grid-template-columns:repeat(9,minmax(72px,1fr));overflow-x:auto;scrollbar-width:none}
}
@media (max-width: 860px){
  .rl-ai .bx-head{gap:12px;padding-top:20px}
  .rl-ai .bx-head .ai-h1{font-size:30px}
  .rl-ai .bx-head p{font-size:13.5px}
  /* the button keeps its words for a screen reader; the eye gets the spark */
  .rl-ai .rl-btn.bx-draft{position:relative;width:42px;padding:0;justify-content:center;gap:0}
  .rl-ai .rl-btn.bx-draft span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .rl-ai .bx-health .l{flex-direction:column;align-items:flex-start;gap:16px;padding:20px 18px}
  .rl-ai .bx-mark{width:104px;height:104px}
  .rl-ai .bx-mark .ai-mind{transform:none}
  .rl-ai .bx-sum .bx-pct b{font-size:38px}
  .rl-ai .bx-sum p{font-size:16.5px}
  .rl-ai .bx-stats>div{padding:0 12px}
  .rl-ai .bx-health .r{padding:20px 18px}
  .rl-ai .bx-health .r .rl-btn{width:100%;justify-content:center}
  .rl-ai .bx-sh{flex-wrap:wrap}
  .rl-ai .bx-sh .bx-shb{width:100%}
  .rl-ai .bx-sh .bx-shb .rl-btn{flex:1;justify-content:center}
  .rl-ai .bx-gap{padding:16px}
  .rl-ai .bx-gap .r{flex-wrap:wrap}
  .rl-ai .bx-gap .t{flex:1 1 calc(100% - 56px)}
  .rl-ai .bx-gap .t p{font-size:16.5px}
  .rl-ai .bx-gap .a{width:100%}
  .rl-ai .bx-gap .a .rl-btn:first-child{flex:1;justify-content:center}
  .rl-ai .bx-gap .w{margin-left:0}
  .rl-ai .bx-cards{grid-template-columns:minmax(0,1fr)}
  .rl-ai .bx-shead .ai-h1{font-size:24px}
  .rl-ai .bx-shead .vr{display:none}
  .rl-ai .bx-form .ai-fld{padding:18px}
  .rl-ai .bx-form .ai-stepbar{padding:14px 18px}
  .rl-ai .bx-seg{display:flex}
  .rl-ai .bx-seg button{flex:1 1 90px;min-width:0}
  .rl-ai .bx-reads .ln{grid-template-columns:86px minmax(0,1fr)}
  .rl-ai .bx-save{width:calc(100% - 24px)}
  .rl-ai .bx-save .rl-btn{flex:1;justify-content:center}
}