/* Team Chat v2 — individualized thread rows, pinned Team thread, notification prompt. Uses app.css tokens. */
.tv2-list{display:flex;flex-direction:column;gap:10px;margin-top:4px}
.tv2-row{position:relative;display:flex;gap:12px;align-items:flex-start;width:100%;text-align:left;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px 12px 16px;box-shadow:var(--sh-1);overflow:hidden;color:var(--text);font:inherit;cursor:pointer;transition:transform .12s,box-shadow .12s}
.tv2-row:active{transform:scale(.985)}
.tv2-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,var(--c1),var(--c2))}
.tv2-row::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,color-mix(in srgb,var(--c2) 9%,transparent),transparent 55%);pointer-events:none}
.tv2-ic{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;color:#fff;background:linear-gradient(140deg,var(--c1),var(--c2));box-shadow:0 6px 16px color-mix(in srgb,var(--c1) 38%,transparent),inset 0 1px 0 rgba(255,255,255,.35);position:relative;z-index:1}
.tv2-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;position:relative;z-index:1}
.tv2-top{display:flex;align-items:center;gap:6px;min-width:0}
.tv2-name{font-weight:750;font-size:15px;letter-spacing:-.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.tv2-top time{margin-left:auto;flex:none;font-size:12px;color:var(--muted);font-weight:600}
.has-unread .tv2-top time{color:var(--c1)}
.tv2-kind,.tv2-addr{font-size:12px;color:var(--muted);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv2-addr svg{vertical-align:-2px;color:var(--c1)}.tv2-jid{font-variant-numeric:tabular-nums;opacity:.8}
.tv2-bot{display:flex;align-items:center;gap:8px;margin-top:2px}
.tv2-prev{flex:1;min-width:0;font-size:13.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tv2-prev b{color:var(--text);font-weight:650}.has-unread .tv2-prev{color:var(--text)}
.tv2-empty{font-style:italic;opacity:.8}
.tv2-unread{flex:none;min-width:22px;height:22px;padding:0 7px;border-radius:999px;display:grid;place-items:center;font-size:12px;font-weight:800;color:#fff;background:linear-gradient(140deg,var(--red-600),var(--red-500));box-shadow:0 3px 10px rgba(215,38,61,.35)}
.tv2-muted{flex:none;color:var(--muted);opacity:.75;display:grid}
.tv2-status{flex:none;font-size:10.5px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:var(--info-bg);color:var(--info)}
.tv2-status.s-in-progress{background:var(--warn-bg);color:var(--warn)}.tv2-status.s-complete{background:var(--ok-bg);color:var(--ok)}
.tv2-kids{display:flex;flex-direction:column;gap:8px;margin:-2px 0 2px 22px;padding-left:12px;border-left:2px solid color-mix(in srgb,var(--c1) 40%,var(--line))}
.tv2-child{padding:10px 12px 10px 14px}.tv2-child .tv2-ic{width:36px;height:36px;border-radius:11px}.tv2-child .tv2-ic svg{width:18px;height:18px}
/* Pinned company-wide Team thread */
.tv2-pinned{border:1.5px solid transparent;background:linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(120deg,#C9A23A,#F3D57A,#C9A23A,#E63950) border-box;box-shadow:0 0 0 3px rgba(201,162,58,.14),0 10px 30px rgba(201,162,58,.28);padding:16px 16px 16px 18px;animation:tv2glow 3.2s ease-in-out infinite}
.tv2-pinned::before{width:5px}
.tv2-pinned::after{background:linear-gradient(120deg,rgba(243,213,122,.20),rgba(230,57,80,.05) 60%,transparent)}
.tv2-pinned .tv2-ic{width:54px;height:54px;border-radius:16px;background:linear-gradient(140deg,var(--navy-800),var(--navy-600));color:#F3D57A;box-shadow:0 0 0 2px #E9C766,0 8px 20px rgba(201,162,58,.4)}
.tv2-pinned .tv2-name{font-size:17px}
.tv2-pin{flex:none;display:inline-flex;align-items:center;gap:3px;font-size:10.5px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;padding:3px 8px;border-radius:999px;color:#4A3500;background:linear-gradient(120deg,#F3D57A,#E2B647)}
@keyframes tv2glow{0%,100%{box-shadow:0 0 0 3px rgba(201,162,58,.14),0 10px 30px rgba(201,162,58,.22)}50%{box-shadow:0 0 0 4px rgba(201,162,58,.26),0 12px 36px rgba(201,162,58,.42)}}
@media (prefers-reduced-motion:reduce){.tv2-pinned{animation:none}}
.tv2-tbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.tv2-mute.on{color:var(--warn)}
/* Notification prompt */
.pn-sheet{text-align:center}
.pn-orb{width:68px;height:68px;margin:2px auto 12px;border-radius:22px;display:grid;place-items:center;color:#F3D57A;background:linear-gradient(140deg,var(--navy-800),var(--navy-600));box-shadow:0 0 0 2px #E9C766,0 12px 30px rgba(11,31,58,.35)}
.pn-sheet h3{font-size:20px;letter-spacing:-.3px}
.pn-perks,.pn-steps{text-align:left;margin:0 auto 16px;max-width:360px;padding-left:20px;color:var(--muted);font-size:14px;line-height:1.7}
.pn-perks li::marker{content:"✓  ";color:var(--ok);font-weight:800}
.pn-steps b{color:var(--text)}
.pn-go{background:linear-gradient(135deg,var(--red-600),var(--red-500));box-shadow:0 8px 22px rgba(215,38,61,.35)}
.pn-sheet .btn.ghost{margin-top:6px}

/* Secondary permanent pin (own department) — silver, smaller badge than gold TEAM */
.tv2-pinned2{border:1.5px solid transparent;background:linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(120deg,#9AA4B2,#E6EBF1,#9AA4B2,var(--c1,#6B7A90)) border-box;box-shadow:0 0 0 2px rgba(154,164,178,.16),0 6px 18px rgba(110,122,140,.22)}
.tv2-pinned2 .tv2-ic{box-shadow:0 0 0 2px #C7CED8}
.tv2-pin2{flex:none;display:inline-flex;align-items:center;gap:2px;font-size:9px;font-weight:800;letter-spacing:.4px;text-transform:uppercase;padding:2px 6px;border-radius:999px;color:#2F3A48;background:linear-gradient(120deg,#E6EBF1,#B9C2CE)}

/* ===== Thread chat: swipe-to-reply, quotes, reactions (Nov 2026) ===== */
.tc-m{position:relative;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.tc-m.ab{align-self:flex-start}.tc-m.me{align-self:flex-end}
.tc-bub{display:flex;flex-direction:column;max-width:100%;min-width:0;will-change:transform}
.tc-m.me .tc-bub{align-items:flex-end}.tc-m.ab .tc-bub{align-items:flex-start}
.tc-m .msg{max-width:min(86vw,560px)}
.tc-swipe-ic{position:absolute;left:-2px;top:50%;width:30px;height:30px;margin-top:-15px;border-radius:50%;display:grid;place-items:center;font-size:15px;font-weight:800;color:var(--navy-700);background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-1);opacity:calc(var(--sw,0) * .9);transform:scale(calc(.4 + var(--sw,0) * .6));transition:background .15s,color .15s;pointer-events:none}
.tc-m.me .tc-swipe-ic{left:auto;right:calc(100% + 4px)}
.tc-m.armed .tc-swipe-ic{background:var(--navy-700);color:#fff;opacity:1}
.tc-m.lifted .msg{transform:scale(1.03);box-shadow:var(--sh-2);transition:transform .18s var(--ease,ease)}
.tc-m.flash .msg{animation:tcflash 1.4s ease}
@keyframes tcflash{0%,100%{box-shadow:var(--sh-1)}20%,60%{box-shadow:0 0 0 3px color-mix(in srgb,var(--red-500) 55%,transparent),var(--sh-2)}}
/* quote inside a bubble */
.rq{display:flex;flex-direction:column;gap:1px;width:100%;text-align:left;font:inherit;cursor:pointer;margin:2px 0 6px;padding:6px 10px;border:0;border-left:3px solid var(--red-500);border-radius:10px;background:color-mix(in srgb,var(--navy-700) 8%,transparent);color:inherit;white-space:normal}
.msg.me .rq{background:rgba(255,255,255,.13);border-left-color:#F3D57A}
.rq b{font-size:12px;font-weight:750;color:var(--red-600)}.msg.me .rq b{color:#F3D57A}
.rq span{font-size:12.5px;opacity:.85;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
/* composer reply preview */
.rq-compose{display:flex;align-items:center;gap:10px;margin:0 0 8px;padding:8px 8px 8px 0;background:var(--surface-2);border:1px solid var(--line);border-radius:14px;animation:up .18s ease-out;overflow:hidden}
.rq-compose[hidden]{display:none}
.rq-bar{align-self:stretch;width:4px;border-radius:0 4px 4px 0;background:linear-gradient(180deg,var(--red-600),var(--red-500))}
.rq-body{flex:1;min-width:0;display:flex;flex-direction:column}
.rq-body b{font-size:12.5px;color:var(--red-600);font-weight:750}
.rq-body span{font-size:13px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rq-x{flex:none;width:30px;height:30px;border-radius:50%;border:0;background:var(--line);color:var(--muted);font-size:13px;font-weight:800;cursor:pointer}
/* reaction pills */
.rx-pills{display:flex;flex-wrap:wrap;gap:4px;margin-top:-6px;padding:0 8px;position:relative;z-index:1}
.rx-pill{display:inline-flex;align-items:center;gap:3px;height:26px;padding:0 8px;border-radius:999px;border:1px solid var(--line);background:var(--surface);box-shadow:var(--sh-1);font:inherit;font-size:14px;cursor:pointer;color:var(--text);animation:rxpop .25s cubic-bezier(.2,.9,.3,1.4)}
.rx-pill b{font-size:12px;font-weight:750;color:var(--muted)}
.rx-pill.mine{border-color:color-mix(in srgb,var(--info) 55%,var(--line));background:var(--info-bg)}.rx-pill.mine b{color:var(--info)}
@keyframes rxpop{from{transform:scale(.4);opacity:0}to{transform:none;opacity:1}}
/* long-press layer */
.rx-layer{position:fixed;inset:0;z-index:60;background:rgba(7,21,40,.28);-webkit-backdrop-filter:blur(6px) saturate(1.2);backdrop-filter:blur(6px) saturate(1.2);animation:fade .15s}
.rx-layer.out{opacity:0;transition:opacity .15s}
.rx-bar{position:fixed;display:flex;align-items:center;gap:2px;padding:6px 8px;border-radius:999px;background:var(--surface);border:1px solid var(--line);box-shadow:0 14px 40px rgba(3,10,22,.28);animation:rxbar .22s cubic-bezier(.2,.9,.3,1.3);max-width:calc(100vw - 16px)}
@keyframes rxbar{from{transform:translateY(8px) scale(.85);opacity:0}to{transform:none;opacity:1}}
.rx-q{width:42px;height:42px;border:0;border-radius:50%;background:transparent;font-size:26px;line-height:1;cursor:pointer;transition:transform .12s}
.rx-q:hover,.rx-q:active{transform:scale(1.25) translateY(-3px)}
.rx-q.on{background:var(--info-bg)}
.rx-more{width:36px;height:36px;margin-left:2px;border:0;border-radius:50%;background:var(--surface-2);color:var(--muted);font-size:22px;font-weight:500;cursor:pointer}
.rx-menu{position:fixed;min-width:190px;border-radius:14px;overflow:hidden;background:var(--surface);border:1px solid var(--line);box-shadow:0 14px 40px rgba(3,10,22,.28);animation:rxbar .22s ease-out}
.rx-menu button{display:flex;justify-content:space-between;align-items:center;width:100%;padding:13px 16px;border:0;background:transparent;color:var(--text);font:inherit;font-size:15px;font-weight:600;cursor:pointer}
.rx-menu button+button{border-top:1px solid var(--line)}
.rx-menu button:active{background:var(--surface-2)}
.rx-who{display:flex;align-items:center;gap:12px;padding:10px 2px;border-bottom:1px solid var(--line);font-size:14px}
.rx-who-e{font-size:24px}.rx-who span:nth-child(2){flex:1}.rx-who b{color:var(--muted)}
.rx-pick{max-height:62vh;display:flex;flex-direction:column;padding-top:12px}
.rx-tabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:10px;scrollbar-width:none}
.rx-tabs button{flex:none;border:1px solid var(--line);background:var(--surface-2);border-radius:999px;padding:6px 12px;font:inherit;font-size:13px;font-weight:650;color:var(--muted);cursor:pointer}
.rx-tabs button.on{background:var(--navy-700);color:#fff;border-color:var(--navy-700)}
.rx-grid{overflow-y:auto;flex:1}
.rx-cat{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr))}
.rx-cat-h{grid-column:1/-1;font-size:12px;font-weight:750;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;padding:10px 4px 4px}
.rx-e{height:44px;border:0;background:transparent;font-size:27px;border-radius:12px;cursor:pointer}.rx-e:active{background:var(--surface-2)}
/* call log + header call buttons */
.tc-calllog{align-self:center;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;border-radius:16px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--sh-1);margin:4px 0}
.tc-cl-ic{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--ok-bg);font-size:16px}
.tc-calllog.missed .tc-cl-ic{background:var(--red-100)}.tc-calllog.missed b{color:var(--red-600)}
.tc-calllog b{display:block;font-size:13.5px}.tc-calllog small{font-size:11.5px;color:var(--muted)}
.top.tc-has-call{position:sticky}
.tc-callbar{position:absolute;right:var(--sp-4);bottom:16px;display:flex;gap:8px}
.tc-callbtn{width:40px;height:40px;border-radius:50%;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.12);color:#fff;display:grid;place-items:center;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.tc-callbtn.vid{background:linear-gradient(140deg,#21B26F,#1F9D6B);border-color:transparent;box-shadow:0 6px 16px rgba(31,157,107,.4)}
.tc-callbtn:active{transform:scale(.92)}
.top.tc-has-call h1,.top.tc-has-call .sub{padding-right:100px}

/* ===== Call screen (FaceTime-like) ===== */
.pc-call{position:fixed;inset:0;z-index:90;background:radial-gradient(120% 80% at 50% 0%,#16325C,#071528 70%);color:#fff;display:flex;flex-direction:column;animation:fade .2s}
.pc-call.out,.pc-incoming.out{opacity:0;transition:opacity .25s}
.pc-top{padding:calc(var(--safe-t) + 14px) 18px 8px;text-align:center;position:relative;z-index:2}
.pc-title{font-weight:750;font-size:17px;letter-spacing:-.2px}
.pc-status{font-size:13px;opacity:.7;font-variant-numeric:tabular-nums;margin-top:2px}
.pc-grid{flex:1;display:grid;gap:8px;padding:8px 10px;grid-template-columns:1fr;grid-auto-rows:1fr;min-height:0}
.pc-grid[data-n="2"]{grid-template-columns:1fr}
.pc-grid[data-n="3"],.pc-grid[data-n="4"]{grid-template-columns:1fr 1fr}
.pc-grid[data-n="5"],.pc-grid[data-n="6"],.pc-grid[data-n="7"],.pc-grid[data-n="8"]{grid-template-columns:1fr 1fr}
@media (min-width:760px){.pc-grid[data-n="2"]{grid-template-columns:1fr 1fr}.pc-grid[data-n="5"],.pc-grid[data-n="6"],.pc-grid[data-n="7"],.pc-grid[data-n="8"]{grid-template-columns:1fr 1fr 1fr}}
.pc-tile{position:relative;border-radius:22px;overflow:hidden;background:linear-gradient(140deg,#12305A,#0B1F3A);box-shadow:0 10px 30px rgba(0,0,0,.35);min-height:0}
.pc-tile video{width:100%;height:100%;object-fit:cover;display:block}
.pc-ava,.pc-orb{display:grid;place-items:center;border-radius:50%;font-weight:800;color:#0B1F3A;background:linear-gradient(140deg,#F3D57A,#E2B647);box-shadow:0 0 0 4px rgba(243,213,122,.18),0 12px 30px rgba(0,0,0,.35)}
.pc-ava{position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;font-size:28px;display:none}
.pc-tile.cam-off video{visibility:hidden}.pc-tile.cam-off .pc-ava{display:grid}
.pc-name{position:absolute;left:10px;bottom:10px;display:flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;font-size:12.5px;font-weight:650;background:rgba(7,21,40,.55);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.pc-mute{display:none}.pc-mute svg{width:14px;height:14px;color:#FF6B7D}.pc-tile.mic-off .pc-mute{display:inline-flex}
.pc-wait{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;font-size:15px;opacity:.9}
.pc-orb{width:112px;height:112px;font-size:38px}
.pc-call.waiting .pc-orb{animation:pcpulse 1.6s ease-in-out infinite}
@keyframes pcpulse{0%,100%{box-shadow:0 0 0 0 rgba(243,213,122,.45),0 12px 30px rgba(0,0,0,.35)}50%{box-shadow:0 0 0 22px rgba(243,213,122,0),0 12px 30px rgba(0,0,0,.35)}}
.pc-self{position:absolute;right:14px;top:calc(var(--safe-t) + 70px);width:104px;height:146px;border-radius:18px;overflow:hidden;background:#0B1F3A;box-shadow:0 10px 26px rgba(0,0,0,.45),0 0 0 1.5px rgba(255,255,255,.25);z-index:3}
.pc-self video{width:100%;height:100%;object-fit:cover;transform:scaleX(-1)}.pc-call.rear .pc-self video{transform:none}
.pc-self-off{position:absolute;inset:0;display:none;place-items:center;opacity:.7}.pc-call.self-off .pc-self-off{display:grid}.pc-call.self-off .pc-self video{visibility:hidden}
.pc-call.voice.self-off .pc-self{display:none}
.pc-call.waiting .pc-self{width:120px;height:170px}
.pc-ctrls{display:flex;justify-content:center;gap:12px;padding:14px 12px calc(var(--safe-b) + 22px);margin:0 10px 10px;border-radius:28px;background:rgba(255,255,255,.08);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.pc-btn{display:flex;flex-direction:column;align-items:center;gap:5px;width:58px;border:0;background:none;color:#fff;font:inherit;font-size:11px;font-weight:600;cursor:pointer;padding:0}
.pc-btn svg{width:54px;height:54px;padding:15px;border-radius:50%;background:rgba(255,255,255,.16);box-sizing:border-box;transition:background .15s,transform .12s}
.pc-btn:active svg{transform:scale(.92)}
.pc-btn.off svg{background:#fff;color:#0B1F3A}
.pc-btn:disabled{opacity:.4}
.pc-end svg{background:#E5383B!important;color:#fff!important;padding:12px}
/* incoming */
.pc-incoming{position:fixed;inset:0;z-index:95;color:#fff;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(180deg,#0B1F3A,#071528);animation:fade .25s;overflow:hidden}
.pc-in-glow{position:absolute;inset:-30%;background:radial-gradient(40% 35% at 50% 35%,rgba(243,213,122,.25),transparent 70%),radial-gradient(50% 40% at 30% 80%,rgba(230,57,80,.18),transparent 70%);animation:pcglow 6s ease-in-out infinite alternate}
@keyframes pcglow{to{transform:translate(4%,-3%) scale(1.08)}}
.pc-in-body{position:relative;text-align:center;padding:calc(var(--safe-t) + 70px) 24px 0;display:flex;flex-direction:column;align-items:center}
.pc-in-kind{font-size:13px;letter-spacing:.4px;text-transform:uppercase;opacity:.7;font-weight:700;margin-bottom:28px}
.pc-ring{animation:pcpulse 1.4s ease-in-out infinite}
.pc-in-name{font-size:32px;font-weight:750;letter-spacing:-.6px;margin-top:26px}
.pc-in-thread{font-size:15px;opacity:.75;margin-top:6px}
.pc-in-acts{position:relative;display:flex;justify-content:space-around;padding:0 30px calc(var(--safe-b) + 60px)}
.pc-in-acts>div{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:14px;font-weight:600}
.pc-round{width:76px;height:76px;border-radius:50%;border:0;display:grid;place-items:center;color:#fff;cursor:pointer;box-shadow:0 12px 30px rgba(0,0,0,.35)}
.pc-round.dec{background:#E5383B}.pc-round.acc{background:#21B26F;animation:pcbounce 1.4s ease-in-out infinite}
.pc-round svg{width:34px;height:34px}
@keyframes pcbounce{0%,100%{transform:none}50%{transform:translateY(-6px)}}
@media (prefers-reduced-motion:reduce){.pc-round.acc,.pc-ring,.pc-in-glow,.pc-call.waiting .pc-orb{animation:none}}


/* ===== Keyboard-safe composer (iOS Safari / PWA + Android) ===== */
:root{--kb:0px;--vvh:100dvh;--composer-h:72px}
.composer{bottom:calc(var(--tab-h) + var(--safe-b) + var(--kb));transition:bottom .12s linear}
body.kb-open,body.composer-focus{overflow:hidden;overscroll-behavior:none}
/* Bottom nav (Home/Chat/Abby/KPIs/More) MUST hide whenever the keyboard or composer focus is up —
   on Android Chrome PWA the nav (z-index 20) otherwise floats over the composer (z-index 15) and covers the text input. */
body.kb-open .tabs,body.composer-focus .tabs{display:none!important;opacity:0;pointer-events:none;visibility:hidden}
body.kb-open .composer,body.composer-focus .composer{bottom:var(--kb,0px);padding-bottom:max(8px,env(safe-area-inset-bottom,0px));background:var(--bg);box-shadow:0 -8px 28px rgba(3,10,22,.12);z-index:30}
body.kb-open .toast,body.composer-focus .toast{bottom:calc(var(--kb,0px) + var(--composer-h) + 16px)}
/* Thread chat: fill the visual viewport, list scrolls, composer pinned above keyboard.
   --vvh is visualViewport.height (already shrinks with the keyboard). --chrome-b is the tab bar when the keyboard is closed. */
body.route-chat.has-composer{--chrome-b:calc(var(--tab-h) + var(--safe-b))}
body.route-chat.kb-open.has-composer,body.route-chat.composer-focus.has-composer{--chrome-b:0px}
body.route-chat.has-composer .app{min-height:0;height:calc(var(--vvh) - var(--chrome-b));max-height:calc(var(--vvh) - var(--chrome-b));padding-bottom:0;display:flex;flex-direction:column;overflow:hidden}
body.route-chat.has-composer .top{flex:none}
body.route-chat.has-composer .tchat-msgs{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:12px 16px 16px;scroll-padding-bottom:12px}
body.route-chat.has-composer .composer.tchat-composer{position:relative;left:auto;right:auto;bottom:auto!important;flex:none;z-index:15;padding-bottom:calc(8px + var(--safe-b));background:var(--bg);border-top:1px solid var(--line);box-shadow:none;transform:none}
body.route-chat.kb-open.has-composer .composer.tchat-composer{padding-bottom:max(8px,env(safe-area-inset-bottom,0px))}
.tchat-composer .rq-compose{margin:0 0 8px}
.tchat-composer form{max-width:728px}
.tv2-ic.tv2-ic-img{background:none;border-radius:50%;padding:0;overflow:hidden;box-shadow:0 4px 12px rgba(16,32,64,.28)}.tv2-ic.tv2-ic-img img{width:100%;height:100%;display:block;border-radius:50%}

/* Prime-branded company thread avatar (logo) + department photo collages */
.tv2-pinned .tv2-ic.tv2-ic-img{border-radius:50%;padding:0;overflow:hidden;background:#102040;box-shadow:0 0 0 2px #E63950,0 0 0 4px rgba(233,199,102,.55),0 10px 24px rgba(200,16,46,.35)}
.tv2-ic.tv2-ic-img{box-shadow:0 4px 14px rgba(16,32,64,.35),0 0 0 1.5px rgba(200,16,46,.55)}
.tv2-row[data-id="whole-team"] .tv2-name{letter-spacing:.2px}
/* Reactions: eight thumb-sized quick picks on a 390px phone, with a compact full picker. */
.rx-q{width:36px;height:38px;font-size:23px;flex:none}
.rx-more{width:32px;height:32px;flex:none}
.rx-pill{min-height:28px;transition:transform .12s,background .12s}
.rx-pill:active{transform:scale(.9)}
.tc-m.rx-double .msg{animation:rxdouble .26s ease-out}
@keyframes rxdouble{50%{transform:scale(1.025)}}
@media(max-width:420px){.rx-bar{gap:0;padding:5px 6px}.rx-q{width:35px;height:38px;font-size:22px}.rx-more{width:29px;height:29px;font-size:21px}.rx-pick{max-height:min(68dvh,560px);padding-bottom:calc(12px + var(--safe-b))}.rx-e{min-height:44px}}
@media(prefers-reduced-motion:reduce){.rx-pill,.rx-bar,.tc-m.rx-double .msg{animation:none;transition:none}}

/* ===== Voice memo recording bar (replaces composer while recording) ===== */
#tcf[hidden],.composer form[hidden],.tc-recbar[hidden]{display:none!important}
.tc-recbar:not([hidden]){display:flex}
.tc-recbar{max-width:728px;margin:0 auto;padding:10px 12px 8px;border-radius:18px;background:linear-gradient(180deg,var(--surface),var(--surface-2));border:1px solid var(--line);box-shadow:0 10px 28px rgba(3,10,22,.12),0 0 0 1px rgba(215,38,61,.08);display:flex;flex-direction:column;gap:10px}
.tc-recbar.recording{border-color:rgba(215,38,61,.35);box-shadow:0 10px 28px rgba(215,38,61,.14),0 0 0 1px rgba(215,38,61,.12)}
.tc-recbar.paused{border-color:rgba(215,38,61,.2);opacity:.97}
.tc-recbar.preview{border-color:var(--line)}
.tc-rec-main{display:flex;align-items:center;gap:10px;min-width:0}
.tc-rec-dot{width:10px;height:10px;border-radius:50%;background:var(--red-600);box-shadow:0 0 0 0 rgba(215,38,61,.55);flex:none;animation:tcRecPulse 1.2s ease-out infinite}
.tc-recbar.paused .tc-rec-dot{animation:none;background:var(--muted);box-shadow:none}
@keyframes tcRecPulse{0%{box-shadow:0 0 0 0 rgba(215,38,61,.55)}70%{box-shadow:0 0 0 10px rgba(215,38,61,0)}100%{box-shadow:0 0 0 0 rgba(215,38,61,0)}}
.tc-rec-time{font-variant-numeric:tabular-nums;font-weight:800;font-size:16px;letter-spacing:.3px;color:var(--text);min-width:3.4em}
.tc-rec-hint{font-size:12px;font-weight:700;color:var(--red-600);text-transform:uppercase;letter-spacing:.4px;margin-left:auto;flex:none}
.tc-recbar.paused .tc-rec-hint{color:var(--muted)}
.tc-rec-wave{flex:1;min-width:48px;max-width:160px;height:28px;display:block}
.tc-rec-meta{display:flex;flex-direction:column;gap:1px;min-width:0}
.tc-rec-label{font-size:12px;font-weight:700;color:var(--muted)}
.tc-rec-play{width:42px;height:42px;border-radius:50%;border:0;background:var(--red-600);color:#fff;font-size:16px;display:grid;place-items:center;flex:none;box-shadow:0 6px 16px rgba(215,38,61,.3)}
.tc-rec-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tc-rec-btn{height:40px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:var(--surface);font-weight:700;font-size:13.5px;color:var(--text);flex:1;min-width:72px}
.tc-rec-btn.ghost{background:var(--surface-2)}
.tc-rec-btn.danger{color:var(--red-600);border-color:rgba(215,38,61,.25);background:var(--red-100)}
.tc-rec-btn.send{flex:1.2;background:var(--red-600);color:#fff;border-color:var(--red-600);box-shadow:0 6px 16px rgba(215,38,61,.28)}
.tc-rec-btn:active{transform:scale(.98)}
body.tc-voice-open .tabs{display:none!important}
@media(max-width:420px){
  .tc-recbar{padding:10px 10px 8px;border-radius:16px}
  .tc-rec-btn{padding:0 10px;font-size:13px;min-width:64px}
  .tc-rec-wave{max-width:110px}
}
@media(prefers-reduced-motion:reduce){.tc-rec-dot{animation:none}.tc-rec-btn{transition:none}}

/* Mandatory notification lock — blocks all app content until subscribed */
html.pn-locked, html.pn-locked body { overflow: hidden !important; }
.pn-bg.pn-lock{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(4,12,28,.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.pn-bg.pn-lock .pn-sheet{width:min(420px,100%);margin:0;border-radius:22px;padding:22px 20px 18px;background:var(--surface,#fff);box-shadow:0 24px 60px rgba(0,0,0,.35);max-height:min(92dvh,720px);overflow:auto;text-align:center}
.pn-lockline{color:var(--text);font-size:15px;line-height:1.5;margin:0 0 12px;font-weight:600}
.pn-error{color:var(--muted);font-size:13px;line-height:1.45;margin:10px 0 0}

.tchat-device{opacity:.62;font-weight:500;font-size:10.5px;letter-spacing:.01em}
.tc-m .msg.rx-pop{animation:rxbubpop .32s cubic-bezier(.2,.9,.3,1.35)}
@keyframes rxbubpop{0%{transform:scale(1)}40%{transform:scale(1.06)}100%{transform:scale(1)}}
.tc-m.rx-double .rx-pill.mine[data-e="👍"]{animation:rxthumb .32s cubic-bezier(.2,.9,.3,1.4)}
@keyframes rxthumb{0%{transform:scale(1)}45%{transform:scale(1.35)}100%{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.tc-m .msg.rx-pop,.tc-m.rx-double .rx-pill.mine,.tc-m.rx-double .rx-pill.mine[data-e="👍"]{animation:none}}