/* ------------------------------------------------------------------
   Messages, on every page: the website, the accounts, the office, the
   Legal Desk and the advocates' pages (owner's review, 10 October 2026).
   A small card in the bottom right corner, across the bottom on a phone.
   Everything here starts vt- and carries its own colours, so it looks the
   same whichever stylesheet the page underneath uses.
   ------------------------------------------------------------------ */
.vt-stack{--vt-paper:#FFFFFF;--vt-ink:#0A2440;--vt-mid:#4B5F77;--vt-soft:#6B7F96;--vt-line:#D3E0EC;--vt-navy:#00447E;
  --vt-ok:#1B7A53;--vt-ok-wash:#E6F4EC;--vt-info:#1D5B96;--vt-info-wash:#E6F0FA;
  --vt-warn:#9A6212;--vt-warn-wash:#FBF0DC;--vt-bad:#B02A2A;--vt-bad-wash:#FBE9E9;
  position:fixed;right:24px;bottom:24px;z-index:9999;display:flex;flex-direction:column;gap:10px;
  width:380px;max-width:calc(100vw - 32px);pointer-events:none;
  font-family:"IBM Plex Sans","Segoe UI",Arial,system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.vt{pointer-events:auto;position:relative;overflow:hidden;display:flex;align-items:center;gap:12px;
  background:var(--vt-paper);color:var(--vt-ink);border:1px solid var(--vt-line);border-radius:12px;
  padding:12px 8px 12px 14px;box-shadow:0 16px 40px rgba(10,36,64,.18),0 2px 6px rgba(10,36,64,.08);
  font-size:14px;line-height:1.45;animation:vt-in .26s cubic-bezier(.2,.8,.2,1) both}
.vt.vt-out{animation:vt-out .22s ease forwards}
.vt-ic{width:32px;height:32px;border-radius:50%;flex:none;display:inline-flex;align-items:center;justify-content:center}
.vt-ic svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.vt-success .vt-ic{color:var(--vt-ok);background:var(--vt-ok-wash)}
.vt-info .vt-ic,.vt-debug .vt-ic{color:var(--vt-info);background:var(--vt-info-wash)}
.vt-warning .vt-ic{color:var(--vt-warn);background:var(--vt-warn-wash)}
.vt-error .vt-ic{color:var(--vt-bad);background:var(--vt-bad-wash)}
.vt-text{flex:1;min-width:0;overflow-wrap:anywhere}
.vt-text b{display:block;font-weight:600}
.vt-text span{color:var(--vt-mid)}
.vt-act{flex:none;font:inherit;font-weight:600;font-size:14px;color:var(--vt-navy);background:none;border:0;
  padding:6px 8px;border-radius:8px;cursor:pointer;text-decoration:none;white-space:nowrap}
.vt-x{flex:none;font:inherit;font-size:20px;line-height:1;color:var(--vt-soft);background:none;border:0;
  width:32px;height:32px;border-radius:8px;cursor:pointer}
@media (hover:hover) and (pointer:fine){.vt-act:hover,.vt-x:hover{background:#EEF4FA}}
.vt-act:focus-visible,.vt-x:focus-visible{outline:2px solid #D69A2C;outline-offset:1px}
.vt-bar{position:absolute;left:0;right:0;bottom:0;height:3px;transform-origin:left;opacity:.85}
.vt-success .vt-bar{background:var(--vt-ok)}.vt-info .vt-bar,.vt-debug .vt-bar{background:var(--vt-info)}
.vt-warning .vt-bar{background:var(--vt-warn)}.vt-error .vt-bar{background:var(--vt-bad)}
@keyframes vt-in{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@keyframes vt-out{to{opacity:0;transform:translateY(10px)}}
@media (max-width:560px){.vt-stack{left:12px;right:12px;bottom:12px;width:auto;max-width:none}}
@media (prefers-reduced-motion:reduce){.vt,.vt.vt-out{animation:none}}
@media print{.vt-stack{display:none}}