/* Reachly UI system — the AI credits panel (public/ui/ai-credits.js), the
   menu-shaped panel the top bar's balance chip opens. Its own sheet: the
   top bar's rl-shell.css holds .topbar rules only. Everything is scoped
   under .rlx, the overlay root. */
/* The menu shape of RlUI, wider: a dark AI card on top (the balance, the
   meter of what is left, the refill), the light details below. */
.rlx .rl-menu.is-credits{width:388px;max-height:calc(100vh - 84px);padding:0;display:flex;flex-direction:column;overflow:hidden;border-radius:18px;background:var(--rl-surface,#fff)}
.rlx .cw-card{position:relative;flex:none;margin:8px 8px 0;padding:15px 16px 16px;border-radius:14px;color:#fff;overflow:hidden;
  background:radial-gradient(120% 95% at 100% 0%,rgba(241,91,65,.34),rgba(241,91,65,0) 58%),linear-gradient(160deg,#252a3a 0%,#181b25 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)}
.rlx .cw-top{display:flex;align-items:center;gap:8px}
.rlx .cw-ey{display:inline-flex;align-items:center;gap:6px;font:500 10.5px/1 'DM Mono',ui-monospace,monospace;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.rlx .cw-ey .rl-ic{color:#ff8f75}
.rlx .cw-state{margin-left:auto;display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 9px;border-radius:999px;background:rgba(255,255,255,.08);font-size:11.5px;font-weight:600;color:rgba(255,255,255,.88)}
.rlx .cw-state i{width:6px;height:6px;border-radius:50%;background:#34d399;box-shadow:0 0 0 3px rgba(52,211,153,.18)}
.rlx .cw-card.is-low .cw-state i{background:#fbbf24;box-shadow:0 0 0 3px rgba(251,191,36,.2)}
.rlx .cw-card.is-out .cw-state i{background:#fb7185;box-shadow:0 0 0 3px rgba(251,113,133,.2)}
.rlx .cw-x{flex:none;width:28px;height:28px;display:grid;place-items:center;margin:-4px -6px -4px 0;border:0;border-radius:8px;background:transparent;color:rgba(255,255,255,.6);cursor:pointer}
.rlx .cw-x:hover{background:rgba(255,255,255,.1);color:#fff}
.rlx .cw-x:focus-visible,.rlx .cw-more:focus-visible{outline:2px solid var(--rl-acc,#f15b41);outline-offset:2px}
.rlx .cw-bal{display:flex;align-items:baseline;gap:8px;margin-top:14px}
.rlx .cw-bal b{font-size:40px;font-weight:800;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.rlx .cw-bal span{font-size:13.5px;color:rgba(255,255,255,.64)}
.rlx .cw-meter{height:6px;margin:14px 0 12px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}
.rlx .cw-meter i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f15b41,#ff8f68);box-shadow:0 0 12px rgba(241,91,65,.6)}
.rlx .cw-card.is-low .cw-meter i{background:linear-gradient(90deg,#d97706,#fbbf24);box-shadow:0 0 12px rgba(251,191,36,.45)}
.rlx .cw-facts{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12.5px;color:rgba(255,255,255,.74)}
.rlx .cw-facts span{display:inline-flex;align-items:center;gap:6px}
.rlx .cw-facts .rl-ic{color:rgba(255,255,255,.46)}
.rlx .cw-bd{flex:1;min-height:0;overflow-y:auto;padding:4px 16px 6px;overscroll-behavior:contain}
.rlx .cw-pace{display:flex;align-items:flex-start;gap:9px;margin:10px 0 2px;padding:10px 12px;border-radius:12px;background:#effaf5;font-size:13px;line-height:1.45;color:#0b5c41}
.rlx .cw-pace .rl-ic{flex:none;margin-top:1px;color:var(--rl-ok,#0e9f6e)}
.rlx .cw-pace.is-warn{background:#fff7ed;color:#9a3412}
.rlx .cw-pace.is-warn .rl-ic{color:var(--rl-warn,#d97706)}
.rlx .cw-sec{margin-top:16px}
.rlx .cw-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 6px;font:500 10.5px/1.2 'DM Mono',ui-monospace,monospace;letter-spacing:.09em;text-transform:uppercase;color:var(--rl-ink3,#8a92a6)}
.rlx .cw-more{border:0;background:none;padding:2px 0;font:600 12px/1 'Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:0;text-transform:none;color:var(--rl-acc2,#e04a30);cursor:pointer}
.rlx .cw-more:hover{text-decoration:underline}
.rlx .cw-can{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;align-items:center;gap:6px}
.rlx .cw-can div{min-width:0;padding:10px 10px 9px;border:1px solid var(--rl-line,#e6e8ef);border-radius:12px;background:var(--rl-surface,#fff)}
.rlx .cw-can b{display:block;font-size:18px;font-weight:800;line-height:1.1;letter-spacing:-.01em;color:var(--rl-ink,#0f1218);font-variant-numeric:tabular-nums}
.rlx .cw-can span{display:block;margin-top:3px;font-size:11.5px;line-height:1.3;color:var(--rl-ink2,#475067)}
.rlx .cw-can em{font-style:normal;font-size:11px;color:var(--rl-ink3,#8a92a6)}
.rlx .cw-row{display:flex;align-items:center;gap:10px;padding:7px 0;border-top:1px solid var(--rl-surface3,#eceef3)}
.rlx .cw-list .cw-row:first-child{border-top:0}
.rlx .cw-tile{flex:none;width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:var(--rl-surface2,#f4f5f8);color:var(--rl-ink2,#475067)}
.rlx .cw-tile.is-plus{background:#e7f7f0;color:var(--rl-ok,#0e9f6e)}
.rlx .cw-row .l{flex:1;min-width:0;font-size:13.5px;line-height:1.35;color:var(--rl-ink,#0f1218)}
.rlx .cw-row .l small{display:block;font-size:11.5px;color:var(--rl-ink3,#8a92a6)}
.rlx .cw-row .l em{font-style:normal;font-weight:600;color:var(--rl-ink3,#8a92a6)}
.rlx .cw-row .v{flex:none;font-size:13.5px;font-weight:700;color:var(--rl-ink,#0f1218);font-variant-numeric:tabular-nums}
.rlx .cw-row .v.is-plus{color:var(--rl-ok,#0e9f6e)}
.rlx .cw-day + .cw-day{margin-top:8px}
.rlx .cw-dh{display:flex;justify-content:space-between;padding:4px 0 2px;font-size:12px;font-weight:700;color:var(--rl-ink2,#475067);font-variant-numeric:tabular-nums}
.rlx .cw-none{padding:6px 0;font-size:13px;color:var(--rl-ink3,#8a92a6)}
.rlx .cw-ft{flex:none;display:flex;align-items:flex-start;gap:10px;margin:6px 8px 8px;padding:11px 13px;border-radius:12px;background:var(--rl-acc-soft,#fff1ed);font-size:12.5px;line-height:1.45;color:var(--rl-ink2,#475067)}
.rlx .cw-ft .rl-ic{flex:none;margin-top:1px;color:var(--rl-acc,#f15b41)}
.rlx .cw-grant{flex:none;margin:6px 8px 8px;padding:11px 12px 12px;border:1px dashed var(--rl-line,#e6e8ef);border-radius:12px}
.rlx .cw-grow{display:flex;gap:8px}
.rlx .cw-grow .rl-ipt{flex:1;min-width:0}
@media (max-width:760px){.rlx .rl-menu.is-credits{width:auto;max-height:84vh}.rlx .cw-bal b{font-size:36px}}