/* ── SIRMIUM GUIDE RAIL ────────────────────────────────────────────────────────────
   The on-page replacement for the chat widget removed 2026-09-20. Same corner, a
   fraction of the size, no network.

   ⛔ IT MUST NOT COVER THE THING IT IS POINTING AT. This is the whole reason the chat
   panel failed on a phone: measured on the live page at 375x812 the open widget was
   311x748 — SEVENTY-SIX PER CENT of the screen — so an assistant saying "the date you
   came on is still open" hid the date you came on. The rail is one line of text and one
   button and is capped at 30vh on a phone. If a future edit makes it taller than that,
   it has become the thing it replaced.

   ⚠️ VISIBILITY NEVER DEPENDS ON AN ANIMATION OR A CALLBACK. The nudge this replaces
   shipped three bugs in a row from exactly that: a class added inside requestAnimationFrame
   (never fires in a background tab), then fill-mode 'both', then the from-keyframe itself.
   Opacity lives in the base rule only; the slide is decoration and cannot hide the card. */

.sgr{
  position:fixed; right:16px; bottom:16px; z-index:9998;
  width:min(330px, calc(100vw - 32px));
  background:#fff; color:#0A1628;
  border:1px solid #e3e0d8; border-left:3px solid #C9A55C; border-radius:11px;
  box-shadow:0 10px 34px rgba(10,22,40,.17);
  font:400 13.5px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  opacity:1; animation:sgrIn .24s ease;
}
@keyframes sgrIn{ from{transform:translateY(8px)} to{transform:none} }

.sgr[hidden]{ display:none; }

.sgr-head{
  display:flex; align-items:center; gap:8px;
  padding:9px 12px 0 13px;
}
.sgr-eyebrow{
  font-size:10.5px; font-weight:700; letter-spacing:.09em; text-transform:uppercase;
  color:#7C6228; margin:0; flex:1 1 auto;
}
.sgr-min{
  flex:0 0 auto; border:0; background:none; cursor:pointer; padding:2px 6px;
  font:inherit; font-size:17px; line-height:1; color:#98a0ad;
}
.sgr-min:hover{ color:#0A1628; }
.sgr-min:focus-visible, .sgr-go:focus-visible{ outline:2px solid #7C6228; outline-offset:2px; }

.sgr-body{ padding:5px 13px 13px; }
.sgr-say{ margin:0; font-size:13.5px; line-height:1.45; color:#3d4450; }
.sgr-say b, .sgr-say strong{ color:#0A1628; font-weight:600; }

.sgr-go{
  margin-top:10px; font:inherit; font-size:12.5px; font-weight:600;
  padding:8px 15px; border-radius:7px;
  border:1px solid #0A1628; background:#0A1628; color:#fff; cursor:pointer;
}
.sgr-go:hover{ background:#16233c; }
.sgr-go[data-tone="gold"]{ border-color:#C9A55C; background:#C9A55C; color:#0A1628; }
.sgr-go[data-tone="gold"]:hover{ background:#d8b775; }

/* guide-rail/2 (2026-09-24): the quiet "skip this" beside the main button. Text, not a second
   button shape, so there is still exactly one thing that looks like the next step. #7C6228 on
   white is about 5.9:1. [hidden] is restated because display below would otherwise beat it. */
.sgr-alt{
  display:inline-block; margin:10px 0 0 12px; padding:8px 2px; border:0; background:none;
  font:inherit; font-size:12.5px; font-weight:600; color:#7C6228; cursor:pointer;
  text-decoration:underline; text-underline-offset:2px;
}
.sgr-alt[hidden]{ display:none; }
.sgr-alt:hover{ color:#0A1628; }
.sgr-alt:focus-visible{ outline:2px solid #7C6228; outline-offset:2px; }
/* The collapsed pill's words open it when the page opts in (cfg.pillOpens). */
.sgr.sgr-pill-opens.is-min .sgr-eyebrow{ cursor:pointer; }

/* Progress. A count of what is ANSWERED, never a percentage: a percentage of a thing
   whose length the member cannot see is not information. */
.sgr-prog{ margin:9px 0 0; height:3px; border-radius:2px; background:#ece8de; overflow:hidden; }
.sgr-prog i{ display:block; height:100%; background:#C9A55C; width:0; transition:width .3s ease; }
.sgr-count{ margin:6px 0 0; font-size:11px; color:#8a92a0; letter-spacing:.02em; }

/* Collapsed: a pill that says what is left, so reopening is a decision not a gamble. */
.sgr.is-min{ width:auto; border-left-width:1px; }
.sgr.is-min .sgr-body, .sgr.is-min .sgr-prog, .sgr.is-min .sgr-count{ display:none; }
.sgr.is-min .sgr-head{ padding:9px 11px; }
.sgr.is-min .sgr-eyebrow{ color:#0A1628; text-transform:none; letter-spacing:0;
  font-size:12.5px; font-weight:600; }

@media (max-width:720px){
  .sgr{ right:10px; left:10px; bottom:10px; width:auto; max-height:30vh; overflow:auto; }
  .sgr.is-min{ left:auto; }
}
@media (prefers-reduced-motion:reduce){
  .sgr{ animation:none; }
  .sgr-prog i{ transition:none; }
}
/* The rail is scaffolding, not content. It has no place in the printed Snapshot. */
@media print{ .sgr{ display:none !important; } }
