/* =====================================================================
   moovr-chat.css - chat with drivers (Goni 2026-10-30): the top bar chat button, the side panel
   (list, then a conversation), the bubbles and the Messages page (11-messages.html).
   Loaded by moovr.js on every page (also Today, which does not load moovr.css), so tokens have fallbacks.
   ===================================================================== */

/* ---- top bar: the chat button next to the bell, with the unread count ---- */
.mv-chatbtn{width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex:none;position:relative;
  color:var(--slate,#3d3b37);cursor:pointer;font:inherit;transition:background-color .15s,transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-chatbtn:hover{background:var(--tint-hover,rgba(17,26,74,.045))}
.mv-chatbtn.open{background:var(--tint-on,rgba(17,26,74,.075))}
.mv-chatbtn svg.i{width:20px;height:20px}
.mv-chatbtn:focus-visible{outline:2px solid var(--navy,#111a4a);outline-offset:2px}
.mv-chatn{position:absolute;top:1px;right:-3px;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--red,#b8361f);color:#fff;
  font-family:var(--mono,"IBM Plex Mono",monospace);font-size:11.5px;font-weight:500;line-height:1;display:inline-flex;align-items:center;justify-content:center;
  border:1.5px solid var(--parch,#f3efe7)}
.mv-chatn[hidden],.mv-chatn-i[hidden]{display:none}
.mv-chatbtn.pressed,.mv-cr.pressed,.mv-qr.pressed,.mv-cbtn.pressed,.mv-chx.pressed,.mv-cv-ib.pressed,.mv-cv-send.pressed,.mv-vp.pressed,.mv-cb-ph.pressed{transform:scale(.97)}
.mv-cr.pressed{transform:scale(.985)}
/* eight menu items: under 1680 wide the bar tightens (search gives way first, then the name; the avatar stays) */
header.top .me{white-space:nowrap}
@media (max-width:1679px){
  header.top .menu a{padding:0 8px;gap:7px}
  header.top .menu a.on::after{left:8px;right:8px}
  header.top .brand{margin-right:18px}
  header.top .navr{gap:8px;padding-left:10px;min-width:0}
  header.top .search{flex:0 1 270px;width:auto;min-width:96px}
  header.top .me{flex:none}
  header.top .search .k{display:none}
}
@media (max-width:1379px){
  header.top .me .me-n{display:none}
  header.top .me{gap:0;padding-left:10px}
}
/* the Message button that sits next to Call: a small navy count for that driver's unread */
.mv-chatn-i{min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--navy,#111a4a);color:#fff;font-family:var(--mono,"IBM Plex Mono",monospace);
  font-size:11.5px;font-weight:500;line-height:1;display:inline-flex;align-items:center;justify-content:center;margin-left:2px}
.mv-prow-b{display:inline-flex;align-items:center;gap:8px}

/* =====================================================================
   THE CHAT LANGUAGE (night pass 2026-10-30, Goni: "the chat is not in our language"). The office chat is the
   reference; DESIGN.md "Chat" holds the rules. Same family as Today: parchment canvas, the Needs-you glass for the
   panel and the page sheet, navy ink and accents, status colours only with a word, the type scale, tabular mono times,
   the same press (moovr-entity.css) and the same navy focus ring.
   ===================================================================== */
.mv-chat,.mv-mp-s{--c-glass:linear-gradient(180deg,color-mix(in srgb,#111a4a 6%,rgba(255,253,249,.74)) 0,rgba(255,253,249,.68) 180px);
  --c-edge:inset 0 1px 0 rgba(255,255,255,.95),inset 0 0 0 1px rgba(255,255,255,.4);
  --c-sh:0 2px 6px rgba(40,30,10,.05),0 28px 60px -24px rgba(40,30,10,.32);
  --c-in:#fffdf9; --c-out:color-mix(in srgb,#111a4a 9%,#fffdf9); --c-hair:rgba(40,30,10,.08)}

/* ---- the side panel: same place and size as the data card; the card opens beside it ---- */
.mv-chat{position:fixed;right:24px;top:84px;bottom:24px;width:440px;max-height:860px;z-index:58;border-radius:16px;overflow:hidden;visibility:hidden;
  background:var(--c-glass);backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);box-shadow:var(--c-edge),var(--c-sh);
  will-change:transform,opacity;text-align:left;color:var(--ink,#1c1b19);font-family:var(--sans,"Instrument Sans",system-ui,sans-serif);font-size:14px;line-height:1.4}
.mv-chv{position:absolute;inset:0;display:flex;flex-direction:column}
.mv-chv + .mv-chv{background:var(--c-glass)}   /* a view sliding over another is opaque enough to hide it */
.mv-ch-h{display:flex;align-items:center;gap:6px;height:64px;padding:0 10px 0 20px;flex:none}
.mv-ch-h h2{font-size:21px;line-height:1.1;font-weight:480;letter-spacing:-.02em;color:var(--navy,#111a4a);margin-right:auto}
.mv-chfull{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 10px;border-radius:8px;font-size:14px;font-weight:560;color:var(--navy,#111a4a);text-decoration:none}
.mv-chfull:hover{background:var(--tint-hover,rgba(17,26,74,.045))}
.mv-chfull svg.i{width:15px;height:15px}
.mv-chx{width:38px;height:38px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;flex:none;color:var(--slate,#3d3b37);cursor:pointer;
  transition:background-color .15s,color .15s,transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-chx:hover{background:var(--tint-hover,rgba(17,26,74,.045));color:var(--navy,#111a4a)}
.mv-chx.on{background:var(--tint-on,rgba(17,26,74,.075));color:var(--navy,#111a4a)}
.mv-chx svg.i{width:19px;height:19px}
.mv-chat button:focus-visible,.mv-chat a:focus-visible,.mv-mp button:focus-visible,.mv-mp a:focus-visible,.mv-at button:focus-visible{outline:2px solid var(--navy,#111a4a);outline-offset:2px}
/* a driver or truck card opened from the chat sits beside the panel (still on top), so the chat stays in view */
.mv-ed.by-chat{right:476px}
@media (max-width:640px){.mv-ed.by-chat{right:12px}.mv-chat{left:12px;right:12px;width:auto;top:72px;bottom:12px}}

/* ---- the list of chats ---- */
.mv-cl{flex:1;min-height:0;display:flex;flex-direction:column}
.mv-cl-s{display:flex;align-items:center;gap:8px;height:40px;margin:0 16px 8px;padding:0 12px;border:1px solid var(--c-hair,rgba(40,30,10,.08));border-radius:10px;background:rgba(255,253,249,.82);color:var(--text-glass,#4c483f);flex:none;
  transition:border-color .15s,box-shadow .15s}
.mv-cl-s:focus-within{border-color:var(--navy,#111a4a);box-shadow:0 0 0 3px rgba(17,26,74,.1)}
.mv-cl-s svg.i{width:17px;height:17px;flex:none}
.mv-cl-s input{flex:1;min-width:0;height:100%;border:0;background:none;outline:none;font:inherit;font-size:15px;color:var(--ink,#1c1b19)}
.mv-cl-s input::placeholder{color:var(--text-glass,#4c483f);opacity:.85}
.mv-cl-b{flex:1;min-height:0;overflow:auto;padding:0 8px 12px;scrollbar-width:thin}
.mv-cl-h{padding:14px 12px 6px;font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-glass,#4c483f)}
.mv-cl-none{padding:16px 12px;font-size:15px;color:var(--text-glass,#4c483f)}
.mv-cr{width:100%;display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;text-align:left;cursor:pointer;color:inherit;font:inherit;
  transition:background-color .15s,transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-cr + .mv-cr{margin-top:1px}
.mv-cr:hover{background:var(--tint-hover,rgba(17,26,74,.045))}
.mv-cr.on{background:var(--tint-on,rgba(17,26,74,.075))}
.mv-cr .mv-face{width:44px;height:44px;font-size:15px}
.mv-cr-x{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mv-cr-1{display:flex;align-items:baseline;gap:8px;min-width:0}
.mv-cr-1 b{font-size:15px;font-weight:560;color:var(--ink-glass,#14130f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mv-cr-1 .mono{flex:none;font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12.5px;letter-spacing:.02em;color:var(--text-glass,#4c483f)}
.mv-cr-role{flex:none;font-size:12.5px;font-weight:500;color:var(--text-glass,#4c483f);white-space:nowrap}
.mv-cr-tm{margin-left:auto;flex:none;font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12.5px;letter-spacing:.02em;color:var(--text-glass,#4c483f)}
.mv-cr-2{display:flex;align-items:center;gap:8px;min-width:0}
.mv-cr-p{flex:1;min-width:0;font-size:14px;font-weight:450;color:var(--text-glass,#4c483f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mv-cr-p svg.i{width:15px;height:15px;vertical-align:-2px;margin-right:4px}
.mv-cr-you{color:var(--slate,#3d3b37)}
.mv-cr-n{flex:none;min-width:22px;height:22px;padding:0 7px;border-radius:999px;background:var(--navy,#111a4a);color:#fff;font-family:var(--mono,"IBM Plex Mono",monospace);
  font-size:12px;font-weight:500;line-height:1;display:inline-flex;align-items:center;justify-content:center}
.mv-cr.un .mv-cr-1 b{font-weight:650}
.mv-cr.un .mv-cr-p{color:var(--ink-glass,#14130f);font-weight:540}
.mv-cr.un .mv-cr-tm{color:var(--navy,#111a4a);font-weight:500}

/* ---- one conversation: it sits on the glass, no second fill ---- */
.mv-cv{position:relative;display:flex;flex-direction:column;height:100%;min-height:0}
.mv-cv-h{display:flex;align-items:center;gap:12px;min-height:68px;padding:10px 10px 10px 14px;border-bottom:1px solid var(--c-hair,rgba(40,30,10,.08));flex:none}
.mv-cv-h .mv-face{width:42px;height:42px;font-size:14px}
.mv-cv-who{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mv-cv-n{font-size:17px;line-height:1.2;font-weight:600;letter-spacing:-.01em;color:var(--ink-glass,#14130f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;align-self:flex-start;max-width:100%}
.mv-cv-sub{font-size:13.5px;font-weight:500;color:var(--text-glass,#4c483f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mv-cv-sub .mv-ent{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12.5px;letter-spacing:.02em}
.mv-cv-sub .st{display:inline-flex;align-items:center;gap:7px;font-size:13.5px}
.mv-cv-sub .st .dot{width:7px;height:7px;border-radius:50%}
.mv-cv-typ{color:var(--sea-ink,#12705d);font-weight:560}
.mv-cv-b{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;padding:8px 16px 16px;scrollbar-width:thin}
.mv-cv-none{margin:auto;padding:24px;text-align:center;font-size:15px;color:var(--text-glass,#4c483f)}
/* the day: a mono label between two hairlines (the label grammar of every screen) */
.mv-cv-day{align-self:stretch;display:flex;align-items:center;gap:12px;margin:20px 0 6px}
.mv-cv-day::before,.mv-cv-day::after{content:"";flex:1;height:1px;background:var(--c-hair,rgba(40,30,10,.08))}
.mv-cv-day span{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-glass,#4c483f)}
/* bubbles: the other side on paper (left), the office in a navy wash (right); 14 radius, the sender's corner 6 on the first of a run */
.mv-cb{position:relative;max-width:82%;margin-top:2px;padding:8px 12px 6px;border-radius:14px;font-size:15px;line-height:1.45;color:var(--ink,#1c1b19);overflow-wrap:anywhere}
.mv-cb.first{margin-top:12px}
.mv-cb.in{align-self:flex-start;background:var(--c-in,#fffdf9);box-shadow:0 0 0 1px var(--c-hair,rgba(40,30,10,.08)),0 1px 2px rgba(40,30,10,.05)}
.mv-cb.in.first{border-top-left-radius:6px}
.mv-cb.out{align-self:flex-end;background:#e7e9f1;background:var(--c-out);box-shadow:0 0 0 1px rgba(17,26,74,.07),0 1px 2px rgba(17,26,74,.05)}
.mv-cb.out.first{border-top-right-radius:6px}
.mv-cb-t{display:block;white-space:pre-wrap}
.mv-cb-m{display:flex;align-items:center;justify-content:flex-end;gap:5px;margin-top:2px;font-size:12px;color:var(--steel,#68645c);white-space:nowrap}
.mv-cb-m .mono{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12px;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.mv-tk{width:17px;height:11px;flex:none;color:var(--steel,#68645c)}
.mv-tk.rd{color:var(--sea-ink,#12705d)}
.mv-cb-st{font-size:12px;font-weight:560;color:var(--steel,#68645c)}
.mv-tk.rd + .mv-cb-st{color:var(--sea-ink,#12705d)}
.mv-cb-tag{display:block;margin:0 0 4px}
.mv-cb-tag .mv-ent{display:inline-flex;align-items:center;height:22px;padding:0 7px;border-radius:6px;box-shadow:inset 0 0 0 1px var(--c-hair,rgba(40,30,10,.08));background:rgba(255,253,249,.7);
  font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12px;letter-spacing:.02em;color:var(--sea-ink,#12705d);text-decoration:none}
.mv-cb-tag .mv-ent:hover{box-shadow:inset 0 0 0 1px var(--navy,#111a4a);color:var(--navy,#111a4a)}
/* photo */
.mv-cb.k-photo{padding:5px 5px 6px}
.mv-cb.k-photo .mv-cb-t,.mv-cb.k-photo .mv-cb-m,.mv-cb.k-photo .mv-cb-tag{padding:0 7px}
.mv-cb-ph{display:block;width:248px;height:186px;border-radius:10px;overflow:hidden;cursor:zoom-in;background:#5d5144;transition:transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-cb-ph img{display:block;width:100%;height:100%;object-fit:cover}
.mv-cb.k-photo .mv-cb-t{margin-top:6px}
/* voice note */
.mv-vrow{display:flex;align-items:center;gap:10px;min-width:236px;padding:2px 0}
.mv-vp{width:38px;height:38px;border-radius:50%;flex:none;display:inline-flex;align-items:center;justify-content:center;background:var(--navy,#111a4a);color:#fff;cursor:pointer;
  transition:transform .24s var(--eo,cubic-bezier(.25,1,.5,1)),background-color .15s}
.mv-vp:hover{background:var(--navy-hover,#1c2766)}
.mv-vp svg.i{width:17px;height:17px;fill:currentColor}
.mv-vw{display:flex;align-items:center;gap:2px;height:22px;flex:1}
.mv-vw i{display:block;width:3px;border-radius:2px;background:rgba(17,26,74,.24);transition:background-color .12s}
.mv-vw i.on{background:var(--navy,#111a4a)}
.mv-vd{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12.5px;color:var(--steel,#68645c);min-width:30px;text-align:right;font-variant-numeric:tabular-nums}
.mv-cb-say{display:block;margin-top:6px;padding-top:6px;border-top:1px solid var(--line2,#eee8de);font-size:14px;color:var(--slate,#3d3b37)}
/* location */
.mv-cb.k-location{padding:5px 5px 6px}
.mv-cb.k-location .mv-cb-m,.mv-cb.k-location .mv-cb-tag{padding:0 7px}
.mv-cb-loc{display:block;width:256px;border-radius:10px;overflow:hidden;box-shadow:0 0 0 1px var(--c-hair,rgba(40,30,10,.08));background:var(--paper,#fffdf9)}
.mv-cb-map{display:block;width:100%;height:112px}
.mv-cb-pl{display:flex;align-items:center;gap:7px;padding:8px 10px;font-size:14.5px}
.mv-cb-pl b{font-weight:560}
.mv-cb-pl svg.i{width:17px;height:17px;flex:none;color:var(--navy,#111a4a)}
.mv-cb-lk{display:inline-flex;align-items:center;gap:6px;height:34px;margin:4px 0 0 2px;padding:0 8px;border-radius:8px;font-size:14px;font-weight:560;color:var(--navy,#111a4a);text-decoration:none}
.mv-cb-lk:hover{background:var(--tint-hover,rgba(17,26,74,.045))}
.mv-cb-lk svg.i{width:16px;height:16px}
/* document: the file tile, name, size; a press opens it in the viewer */
.mv-cb.k-doc{padding:5px 5px 6px}
.mv-cb.k-doc .mv-cb-m,.mv-cb.k-doc .mv-cb-tag{padding:0 7px}
.mv-cb-doc{display:flex;align-items:center;gap:12px;width:288px;max-width:100%;padding:10px 12px 10px 10px;border-radius:10px;background:rgba(255,253,249,.78);box-shadow:0 0 0 1px var(--c-hair,rgba(40,30,10,.08));
  text-align:left;font:inherit;color:inherit;cursor:zoom-in;transition:background-color .15s,transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-cb-doc:hover{background:#fffdf9}
.mv-cb-fi{position:relative;flex:none;width:38px;height:46px;border-radius:7px;display:grid;place-items:center;color:var(--navy,#111a4a);background:var(--tint-on,rgba(17,26,74,.075));box-shadow:inset 0 0 0 1px rgba(17,26,74,.1)}
.mv-cb-fi svg.i{width:20px;height:20px;margin-top:-8px}
.mv-cb-fi i{position:absolute;left:0;right:0;bottom:5px;text-align:center;font-style:normal;font-family:var(--mono,"IBM Plex Mono",monospace);font-size:10.5px;font-weight:500;letter-spacing:.04em}
.mv-cb-fn{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.mv-cb-fn b{font-size:14.5px;font-weight:560;line-height:1.3;color:var(--ink,#1c1b19);overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.mv-cb-fn .mono{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12px;letter-spacing:.02em;color:var(--steel,#68645c)}
/* a trip card and a contact card: the bubble IS the card (no card inside a card) */
.mv-cb.k-trip,.mv-cb.k-contact{padding:12px 14px 8px;min-width:280px}
.mv-cb-card{display:flex;flex-direction:column;gap:6px}
.mv-cbk-1{display:flex;align-items:center;gap:8px}
.mv-cbk-1 > svg.i{width:18px;height:18px;color:var(--navy,#111a4a);flex:none}
.mv-cbk-1 .mv-ent{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:13px;letter-spacing:.02em;color:var(--sea-ink,#12705d);margin-right:auto}
.mv-cbk-1 .st{display:inline-flex;align-items:center;gap:6px;font-size:13px;white-space:nowrap}
.mv-cbk-1 .st .dot{width:7px;height:7px;border-radius:50%}
.mv-cbk-r{font-size:16px;font-weight:600;letter-spacing:-.01em;line-height:1.25;color:var(--ink,#1c1b19)}
.mv-cbk-s{font-size:14px;color:var(--steel,#68645c)}
.mv-cbk-kv{display:flex;align-items:center;gap:12px;font-family:var(--mono,"IBM Plex Mono",monospace);font-size:13px;letter-spacing:.02em;color:var(--slate,#3d3b37);font-variant-numeric:tabular-nums}
.mv-cbk-kv .late{color:var(--orange-ink,#b3431a);font-weight:500}
.mv-cbk-a{display:flex;justify-content:flex-end;gap:8px;margin-top:4px}
.mv-cbk-a .mv-cbtn{height:32px;padding:0 12px;font-size:13.5px}
.mv-cbk-p{display:flex;align-items:center;gap:10px}
.mv-cbk-p .mv-face{width:40px;height:40px;font-size:14px}
.mv-cbk-p > span{display:flex;flex-direction:column;min-width:0}
.mv-cbk-p b{font-size:15.5px;font-weight:600;color:var(--ink,#1c1b19)}
.mv-cbk-p small{font-size:13px;color:var(--steel,#68645c)}
/* the other side is writing */
.mv-typing{display:flex;gap:5px;align-items:center;padding:13px 14px}
.mv-typing i{width:7px;height:7px;border-radius:50%;background:var(--steel,#68645c);opacity:.35;animation:mv-typ 1.2s infinite}
.mv-typing i:nth-child(2){animation-delay:.15s}.mv-typing i:nth-child(3){animation-delay:.3s}
@keyframes mv-typ{0%,60%,100%{opacity:.3;transform:none}30%{opacity:.85;transform:translateY(-3px)}}
/* quick replies: they fill the box, nothing is sent until Send */
.mv-cv-q{display:flex;gap:8px;padding:12px 16px 2px;border-top:1px solid var(--c-hair,rgba(40,30,10,.08));flex:none;overflow-x:auto;scrollbar-width:none;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
.mv-cv-q::-webkit-scrollbar{display:none}
.mv-cv-q .mv-qr{flex:none}
.mv-qr{height:34px;padding:0 12px;border-radius:999px;border:0;box-shadow:inset 0 0 0 1px rgba(17,26,74,.16);background:rgba(255,253,249,.82);font:inherit;font-size:14px;font-weight:500;color:var(--navy,#111a4a);
  cursor:pointer;white-space:nowrap;transition:background-color .15s,box-shadow .15s,transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-qr:hover{box-shadow:inset 0 0 0 1px var(--navy,#111a4a);background:#fffdf9}
.mv-cv.recording .mv-qr{opacity:.4;pointer-events:none}
/* the writing bar: +, words, voice note, Send (the one main button) */
.mv-cv-c{position:relative;display:flex;align-items:center;gap:8px;padding:10px 16px 14px;flex:none}
.mv-cv-in{flex:1;min-width:0;height:46px;padding:0 16px;border:1px solid var(--line,#e3dccf);border-radius:12px;background:#fffdf9;font:inherit;font-size:15px;color:var(--ink,#1c1b19);outline:none;
  transition:border-color .15s,box-shadow .15s}
.mv-cv-in::placeholder{color:var(--steel,#68645c);opacity:1}
.mv-cv-in:focus{border-color:var(--navy,#111a4a);box-shadow:0 0 0 3px rgba(17,26,74,.1)}
.mv-cv-file{display:none}
.mv-cv-ib{width:44px;height:46px;border-radius:12px;flex:none;display:inline-flex;align-items:center;justify-content:center;color:var(--navy,#111a4a);cursor:pointer;
  transition:background-color .15s,transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-cv-ib:hover{background:var(--tint-hover,rgba(17,26,74,.045))}
.mv-cv-ib svg.i{width:22px;height:22px;transition:transform .28s var(--ex,cubic-bezier(.16,1,.3,1))}
.mv-cv-plus{background:rgba(255,253,249,.82);box-shadow:inset 0 0 0 1px rgba(17,26,74,.16)}
.mv-cv-plus:hover{background:#fffdf9;box-shadow:inset 0 0 0 1px var(--navy,#111a4a)}
.mv-cv-plus.on{background:var(--navy,#111a4a);color:#fff;box-shadow:none}
.mv-cv-plus.on svg.i{transform:rotate(45deg)}
.mv-cv-ib.mic.on{background:var(--navy,#111a4a);color:#fff}
.mv-cv-send{height:46px;padding:0 20px;border-radius:12px;flex:none;background:var(--navy,#111a4a);color:#fff;font:inherit;font-size:15px;font-weight:560;cursor:pointer;
  box-shadow:0 1px 2px rgba(17,26,74,.18),inset 0 1px 0 rgba(255,255,255,.14);transition:background-color .15s,transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-cv-send:hover{background:var(--navy-hover,#1c2766)}
.mv-cv-send:disabled{background:var(--tint-on,rgba(17,26,74,.075));color:var(--text-glass,#4c483f);box-shadow:none;cursor:default}
.mv-cv-rec{flex:1;min-width:0;display:flex;align-items:center;gap:10px;height:46px;padding:0 6px 0 14px;border-radius:12px;background:var(--tint-stuck,rgba(236,101,43,.12));font-size:15px;color:var(--ink,#1c1b19)}
.mv-cv-rec[hidden]{display:none}
.mv-cv-dot{width:10px;height:10px;border-radius:50%;background:var(--orange,#ec652b);animation:mv-rec 1.4s ease-in-out infinite}
@keyframes mv-rec{50%{opacity:.35}}
.mv-cv-rt{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:14px;color:var(--orange-ink,#b3431a)}
.mv-cv-cancel{margin-left:auto;height:36px;padding:0 12px;border-radius:8px;font:inherit;font-size:14.5px;font-weight:560;color:var(--navy,#111a4a);cursor:pointer}
.mv-cv-cancel:hover{background:rgba(255,255,255,.6)}
.mv-cv.recording .mv-cv-in,.mv-cv.recording .mv-cv-send,.mv-cv.recording .mv-cv-ib:not(.mic){display:none}

/* ---- the attach menu: the popup material, it rises out of the "+" (origin bottom left) and folds back into it ---- */
.mv-at{position:absolute;left:12px;bottom:calc(100% + 4px);z-index:6;width:320px;max-height:min(460px,calc(100vh - 220px));display:flex;flex-direction:column;overflow:hidden;border-radius:16px;
  background:rgba(255,253,249,.96);backdrop-filter:blur(26px) saturate(170%);-webkit-backdrop-filter:blur(26px) saturate(170%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),0 0 0 1px rgba(40,30,10,.07),0 2px 6px rgba(40,30,10,.06),0 30px 64px -20px rgba(30,24,40,.36);
  transform-origin:22px 100%;opacity:0;transform:scale(.9) translateY(6px);filter:blur(4px);
  transition:opacity .14s ease-in,transform .18s ease-in,filter .18s ease-in}
.mv-at.open{opacity:1;transform:none;filter:none;transition:opacity .2s var(--eo,cubic-bezier(.25,1,.5,1)),transform .34s var(--ex,cubic-bezier(.16,1,.3,1)),filter .26s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-at[hidden]{display:none}
.mv-at-b{overflow:auto;scrollbar-width:thin}
.mv-at-pane{padding:6px 8px 10px}
.mv-at-hd{display:flex;align-items:center;gap:4px;min-height:44px;padding:4px 8px 2px 10px}
.mv-at-hd b{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12px;font-weight:450;letter-spacing:.06em;text-transform:uppercase;color:var(--steel,#68645c)}
.mv-at-bk{width:34px;height:34px;margin-left:-6px}
.mv-at-bk + b{font-family:var(--sans,"Instrument Sans",system-ui,sans-serif);font-size:16px;font-weight:560;letter-spacing:-.01em;text-transform:none;color:var(--navy,#111a4a)}
.mv-at-o{width:100%;display:flex;align-items:center;gap:12px;min-height:52px;padding:7px 10px;border-radius:12px;text-align:left;font:inherit;color:inherit;cursor:pointer;
  transition:background-color .15s,transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-at-o:hover,.mv-at-o:focus-visible{background:var(--tint-hover,rgba(17,26,74,.045))}
.mv-at-ic{flex:none;width:38px;height:38px;border-radius:10px;display:grid;place-items:center;color:var(--navy,#111a4a);background:var(--tint-on,rgba(17,26,74,.075));box-shadow:inset 0 0 0 1px rgba(17,26,74,.08)}
.mv-at-ic svg.i{width:20px;height:20px}
.mv-at-w{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.mv-at-w b{font-size:15px;font-weight:560;line-height:1.3;color:var(--ink,#1c1b19);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mv-at-w small{font-size:13px;color:var(--steel,#68645c);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mv-at-ch{width:16px;height:16px;flex:none;color:var(--fog,#a39d91)}
.mv-at-g{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:4px 6px 8px}
.mv-at-p{display:flex;flex-direction:column;gap:5px;padding:0;text-align:left;font:inherit;color:inherit;cursor:pointer;border-radius:10px;transition:transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-at-p img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;box-shadow:0 0 0 1px rgba(40,30,10,.08);transition:box-shadow .15s}
.mv-at-p:hover img,.mv-at-p:focus-visible img{box-shadow:0 0 0 2px var(--navy,#111a4a)}
.mv-at-p span{font-size:13px;line-height:1.3;color:var(--slate,#3d3b37);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mv-at-none{padding:10px 12px 14px;font-size:14.5px;color:var(--steel,#68645c)}
@media (prefers-reduced-motion:reduce){.mv-at,.mv-at.open{transition:opacity .2s;transform:none;filter:none}}
@media (prefers-reduced-transparency:reduce){.mv-at,.mv-chat,.mv-mp-s{background:#fffdf9!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}}

/* the photo viewer, inside the chat */
.mv-cv-v{position:absolute;inset:0;z-index:7;display:flex;flex-direction:column;background:rgba(243,239,231,.97)}
.mv-cv-v[hidden]{display:none}
.mv-cv-vh{display:flex;align-items:center;gap:12px;min-height:64px;padding:10px 12px 10px 20px;border-bottom:1px solid var(--c-hair,rgba(40,30,10,.08))}
.mv-cv-vh > span{flex:1;min-width:0;display:flex;flex-direction:column}
.mv-cv-vh b{font-size:16px;font-weight:600;color:var(--ink,#1c1b19)}
.mv-cv-vh small{font-size:13px;color:var(--steel,#68645c)}
.mv-cv-vi{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;padding:20px}
.mv-cv-vi img{max-width:100%;max-height:100%;object-fit:contain;border-radius:10px;box-shadow:0 18px 40px -16px rgba(40,30,10,.45)}
/* small buttons inside the chat (Call, See trip, Close): navy outline, quiet without */
.mv-cbtn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 13px;flex:none;border-radius:8px;border:1px solid var(--navy,#111a4a);
  background:rgba(255,253,249,.6);color:var(--navy,#111a4a);font:inherit;font-size:14px;font-weight:560;white-space:nowrap;text-decoration:none;cursor:pointer;
  transition:background-color .15s,transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-cbtn:hover{background:#fff}
.mv-cbtn.q{border-color:transparent;background:none}
.mv-cbtn.q:hover{background:var(--tint-hover,rgba(17,26,74,.045))}
.mv-cbtn svg.i{width:16px;height:16px}
@media (prefers-reduced-motion:reduce){.mv-typing i,.mv-cv-dot{animation:none}}

/* ---- the Messages page: the big title and the strip, then ONE glass sheet (chats, conversation, details) ---- */
.mv-mp{display:flex;flex-direction:column;height:calc(100vh - 60px);min-height:600px;padding:16px 24px 24px;box-sizing:border-box}   /* the Trips head: title at 28 / 76 (audit 2026-10-31) */
.mv-mp-hd{display:flex;align-items:center;justify-content:space-between;gap:32px;height:84px;padding:0 4px;flex:none}
.mv-mp-hd .mv-ls{margin-left:auto}
.mv-ls-i.sel b{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.mv-ls.filtered .mv-ls-i:not(.sel){opacity:.55}
.mv-mp-s{flex:1;min-height:0;margin-top:18px;border-radius:16px;overflow:hidden;
  background:var(--c-glass);backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);box-shadow:var(--c-edge),var(--c-sh)}
.mv-mp-g{display:grid;grid-template-columns:minmax(300px,360px) minmax(0,1fr) minmax(300px,340px);height:100%;
  transition:grid-template-columns .34s var(--ex,cubic-bezier(.16,1,.3,1))}
.mv-mp-g.closed,.mv-mp-g.none{grid-template-columns:minmax(300px,360px) minmax(0,1fr) 0}
.mv-mp-l{display:flex;flex-direction:column;min-height:0;padding-top:16px;border-right:1px solid var(--c-hair,rgba(40,30,10,.08))}
.mv-mp-l .mv-cl-s{margin:0 16px 10px}
.mv-mp-fb{display:flex;align-items:center;gap:10px;margin:0 16px 8px;padding:0 4px 0 12px;height:38px;border-radius:10px;background:var(--tint-on,rgba(17,26,74,.075));flex:none}
.mv-mp-fb[hidden]{display:none}
.mv-mp-fw{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:560;color:var(--ink-glass,#14130f)}
.mv-mp-fw i{width:8px;height:8px;border-radius:50%}
.mv-mp-fb .mono{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12.5px;color:var(--text-glass,#4c483f);margin-right:auto}
.mv-mp-fx{width:30px;height:30px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;color:var(--slate,#3d3b37);cursor:pointer;transition:background-color .15s,transform .2s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-mp-fx:hover{background:rgba(255,253,249,.8);color:var(--navy,#111a4a)}
.mv-mp-fx svg.i{width:16px;height:16px}
.mv-mp-c{min-width:0;min-height:0;display:flex;flex-direction:column}
.mv-mp-c .mv-cv-h{padding-left:24px;min-height:76px}
.mv-mp-c .mv-cv-b{padding:8px max(24px,5%) 16px}
.mv-mp-c .mv-cb{max-width:min(70%,560px)}
.mv-mp-c .mv-cv-q{padding:12px max(24px,5%) 2px}
.mv-mp-c .mv-cv-c{padding:10px max(24px,5%) 18px}
.mv-mp-c .mv-at{left:max(18px,calc(5% - 6px))}
.mv-mp-e{margin:auto;display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--text-glass,#4c483f);text-align:center}
.mv-mp-e svg.i{width:44px;height:44px;color:var(--fog,#a39d91)}
.mv-mp-e p{font-size:16px}
/* details: a person card, then "Trip now" when there is one; actions bottom right, the main one last */
.mv-mp-r{min-width:0;overflow:hidden auto;display:flex;flex-direction:column;border-left:1px solid var(--c-hair,rgba(40,30,10,.08));scrollbar-width:thin;
  transition:opacity .2s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-mp-g.closed .mv-mp-r{opacity:0;border-left-color:transparent}
.mv-mp-r > *{min-width:300px}
.mv-mp-rh{display:flex;align-items:center;justify-content:space-between;height:52px;padding:8px 10px 0 24px;flex:none}
.mv-mp-rh h2{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12px;font-weight:450;letter-spacing:.06em;text-transform:uppercase;color:var(--text-glass,#4c483f)}
.mv-mp-who{display:flex;align-items:center;gap:14px;padding:8px 24px 16px}
.mv-mp-who .mv-face{width:56px;height:56px;font-size:18px;flex:none}
.mv-mp-who > div{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.mv-mp-n{font-size:22px;line-height:1.15;font-weight:480;letter-spacing:-.02em;color:var(--navy,#111a4a);align-self:flex-start;text-decoration:none}
.mv-mp-role{font-size:13.5px;font-weight:500;color:var(--text-glass,#4c483f)}
.mv-mp-kvs{display:flex;flex-direction:column;padding:0 24px}
.mv-mp-kv{display:grid;grid-template-columns:88px minmax(0,1fr);align-items:baseline;gap:8px;padding:9px 0;font-size:14.5px;font-weight:500;color:var(--ink-glass,#14130f);border-top:1px solid var(--c-hair,rgba(40,30,10,.08))}
.mv-mp-kv > span:first-child{font-size:13.5px;color:var(--text-glass,#4c483f)}
.mv-mp-kv > span:last-child{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;min-width:0}
.mv-mp-kv .mono,.mv-mp-kv .mv-ent.mono{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:13.5px;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.mv-mp-kv .mv-ent[data-trip]{color:var(--sea-ink,#12705d)}
.mv-mp-sm{font-size:13.5px;color:var(--text-glass,#4c483f)}
.mv-mp-tl{display:flex;align-items:baseline;gap:8px;width:100%}
.mv-mp-kv s{color:var(--steel,#68645c);margin-right:2px}
.mv-mp-kv .late{color:var(--orange-ink,#b3431a);font-weight:500}
.mv-mp-trip{margin:16px 16px 0;padding:14px 8px 4px;border-radius:12px;background:rgba(255,253,249,.62);box-shadow:0 0 0 1px var(--c-hair,rgba(40,30,10,.08))}
.mv-mp-trip .mv-mp-kvs{padding:0 8px}
.mv-mp-k{margin:0 8px 10px;font-family:var(--mono,"IBM Plex Mono",monospace);font-size:12px;font-weight:450;letter-spacing:.06em;text-transform:uppercase;color:var(--text-glass,#4c483f)}
.mv-mp-t1{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:0 8px}
.mv-mp-t1 > .mv-ent{font-family:var(--mono,"IBM Plex Mono",monospace);font-size:14px;letter-spacing:.02em;color:var(--sea-ink,#12705d);font-weight:500}
.mv-mp-route{margin:6px 8px 10px;font-size:17px;font-weight:600;letter-spacing:-.01em;color:var(--ink-glass,#14130f)}
.mv-mp-acts{position:sticky;bottom:0;display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:auto;padding:16px 24px 20px;
  background:linear-gradient(180deg,rgba(250,247,241,0),rgba(250,247,241,.94) 14px);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.mv-mp-acts .btn{text-decoration:none}
.mv-mp-r .st{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-size:14px}
.mv-mp-r .st .dot,.mv-cv-sub .st .dot{flex:none}
.mv-mp-r .st-road,.mv-mp-r .st-planned,.mv-cv-sub .st-road,.mv-cv-sub .st-planned{color:var(--navy,#111a4a)}
.mv-mp-r .st-wait,.mv-cv-sub .st-wait{color:var(--amber-ink,#87580d)} .mv-mp-r .st-done,.mv-cv-sub .st-done{color:var(--sea-ink,#12705d)}
.mv-mp-r .st-stuck,.mv-mp-r .st-nogps,.mv-cv-sub .st-stuck,.mv-cv-sub .st-nogps{color:var(--orange-ink,#b3431a);font-weight:560} .mv-mp-r .st-closed,.mv-cv-sub .st-closed{color:var(--steel,#68645c)}

@media (max-width:1439px){.mv-mp .mv-cr-1 .mono{display:none} .mv-mp-g{grid-template-columns:minmax(280px,320px) minmax(0,1fr) minmax(280px,312px)} .mv-mp-g.closed,.mv-mp-g.none{grid-template-columns:minmax(280px,320px) minmax(0,1fr) 0} .mv-mp-r > *{min-width:280px}}
@media (prefers-reduced-motion:reduce){.mv-mp-g{transition:none}}
/* the toast stays above the chat panel (Today writes its own toast at a lower layer) */
body > .toast{z-index:61}

/* ---- a shared location on a real map, OVER the chat (moovr.js moOpen): the one popup material, grows from the link ---- */
.mv-mo{position:fixed;z-index:59;display:flex;flex-direction:column;visibility:hidden;will-change:transform,opacity;text-align:left;overflow:hidden;border-radius:16px;
  color:var(--ink,#1c1b19);font-family:var(--sans,"Instrument Sans",system-ui,sans-serif);font-size:14px;line-height:1.4;
  background:linear-gradient(180deg,color-mix(in srgb,#111a4a 7%,rgba(255,253,249,.78)) 0,rgba(255,253,249,.72) 140px);
  backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.95),inset 0 0 0 1px rgba(255,255,255,.4),0 2px 6px rgba(40,30,10,.05),0 28px 60px -24px rgba(40,30,10,.32)}
.mv-mo-h{display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 12px 10px 16px;flex:none}
.mv-mo-ic{width:40px;height:40px;border-radius:10px;flex:none;display:grid;place-items:center;background:var(--tint-on,rgba(17,26,74,.075));color:var(--navy,#111a4a)}
.mv-mo-ic svg.i{width:20px;height:20px}
.mv-mo-w{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.mv-mo-w b{font-size:17px;line-height:1.2;font-weight:600;letter-spacing:-.01em;color:var(--ink-glass,#14130f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mv-mo-w small{font-size:13.5px;font-weight:500;color:var(--text-glass,#4c483f);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mv-mo-x{width:38px;height:38px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;flex:none;color:var(--slate,#3d3b37);cursor:pointer;
  transition:background-color .15s,transform .24s var(--eo,cubic-bezier(.25,1,.5,1))}
.mv-mo-x:hover{background:var(--tint-hover,rgba(17,26,74,.045))}
.mv-mo-m{position:relative;flex:1;min-height:0;margin:0 12px;border-radius:12px;overflow:hidden;background:#f1ece2;box-shadow:0 0 0 1px rgba(40,30,10,.08)}
.mv-mo-m .state{position:absolute;inset:0;justify-content:center;align-items:center;text-align:center}
.mv-mo-f{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-height:20px;padding:12px 16px 14px;flex:none}
.mv-mo-f:empty{padding:0 0 12px}
.mv-mo-f .btn{text-decoration:none}

/* ===== clean pass (Goni 2026-10-31: "not clean and pleasant enough") =====
   Bubbles and pills get a hairline border instead of stacked shadows; nothing glass sits on the glass;
   one weight for unread (600 / 560), times 12 mono like every other time label. */
.mv-cb.in{box-shadow:none;border:1px solid var(--c-hair,rgba(40,30,10,.08))}
.mv-cb.out{box-shadow:none;border:1px solid rgba(17,26,74,.08)}
.mv-cb-loc,.mv-cb-doc,.mv-at-p img{box-shadow:none;border:1px solid var(--c-hair,rgba(40,30,10,.08))}
.mv-qr,.mv-cv-plus{box-shadow:none;border:1px solid rgba(17,26,74,.16)}
.mv-qr:hover,.mv-cv-plus:hover{box-shadow:none;border-color:var(--navy,#111a4a)}
.mv-qr{background:var(--paper,#fffdf9)}
.mv-cv-plus{background:var(--paper,#fffdf9)}
.mv-cv-plus.on{border-color:var(--navy,#111a4a)}
.mv-cv-send{box-shadow:none}
.mv-cb-tag .mv-ent{box-shadow:none;border:1px solid var(--c-hair,rgba(40,30,10,.08));background:transparent}
.mv-cb-fi,.mv-at-ic{box-shadow:none}
.mv-cl-s{background:var(--paper,#fffdf9)}
.mv-cbtn{background:transparent}
.mv-mp-trip{background:transparent;box-shadow:none;border:1px solid var(--c-hair,rgba(40,30,10,.08))}
.mv-mp-acts{-webkit-backdrop-filter:none;backdrop-filter:none}
.mv-cr-1 .mono{font-size:12px}
.mv-cr.un .mv-cr-1 b{font-weight:600}
.mv-cr.un .mv-cr-p{font-weight:560}
.mv-cr-tm{font-size:12px}
/* trip codes are navy mono everywhere (sea green only means done / OK) */
.mv-cb-tag .mv-ent,.mv-cbk-1 .mv-ent,.mv-mp-kv .mv-ent[data-trip],.mv-mp-t1 > .mv-ent{color:var(--navy,#111a4a)}