:root{--bg:#08090d;--card:#12141b;--card2:#191c25;--line:rgba(255,255,255,.08);--text:#f7f7fb;--muted:rgba(255,255,255,.56);--accent:#7c5cff;--accent2:#d85cff;--danger:#ff5b7e;--ok:#46d98d;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;min-height:100%;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif}body{min-height:100dvh}button,input,textarea{font:inherit}button{color:inherit}.hidden{display:none!important}.muted{color:var(--muted)}.small{font-size:12px}.spacer{flex:1}.row{display:flex;align-items:center}.glass{background:rgba(8,9,13,.84);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
#shell{min-height:100dvh;padding-bottom:calc(78px + var(--safe-bottom))}#page{max-width:640px;margin:auto}.topbar{position:sticky;top:0;z-index:30;height:calc(61px + var(--safe-top));padding:calc(10px + var(--safe-top)) 16px 10px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:9px;border:0;background:transparent;font-weight:900;letter-spacing:2px;font-size:20px;padding:0}.pulse-mark{width:27px;height:27px;border:2px solid var(--accent);border-radius:50%;display:grid;place-items:center}.pulse-mark i{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 16px var(--accent)}.beta-pill{margin-left:auto;border-radius:999px;padding:6px 9px;background:rgba(124,92,255,.14);color:#c8bdff;font-size:10px;font-weight:800;letter-spacing:.7px}.icon-btn{position:relative;border:0;background:rgba(255,255,255,.06);width:36px;height:36px;border-radius:50%;display:grid;place-items:center}.notif-dot{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--danger);right:2px;top:2px;border:2px solid var(--bg)}
.tabbar{position:fixed;z-index:40;left:0;right:0;bottom:0;height:calc(66px + var(--safe-bottom));padding:7px 10px var(--safe-bottom);display:flex;border-top:1px solid var(--line)}.tab{width:20%;border:0;background:transparent;color:rgba(255,255,255,.45);display:flex;flex-direction:column;align-items:center;gap:2px}.tab.active{color:#fff}.tab>span{font-size:24px;line-height:25px;font-weight:600}.tab .plus{font-size:30px}.tab small{font-size:10px}
.section{padding:18px 16px}.page-title{font-size:34px;margin:0;font-weight:800;letter-spacing:-1.2px}.card{background:var(--card);border:1px solid var(--line);border-radius:20px}.avatar{border-radius:50%;object-fit:cover;background:linear-gradient(145deg,#6148dd,#b75cff);border:1px solid rgba(255,255,255,.1)}.avatar-fallback{border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#6148dd,#b75cff);font-weight:800}.name{font-weight:700}.username{color:var(--muted);font-size:12px}
.feed{border-top:1px solid var(--line)}.post{padding:16px;border-bottom:1px solid var(--line)}.post-head{display:flex;align-items:center;gap:10px}.post-head button{border:0;background:none;padding:0;text-align:left}.post-text{font-size:16px;line-height:1.43;margin:13px 0;white-space:pre-wrap;overflow-wrap:anywhere}.post-media{width:100%;max-height:520px;object-fit:cover;border-radius:22px;border:1px solid rgba(255,255,255,.1);background:#111}.actions{display:flex;gap:20px;align-items:center;margin-top:12px}.action{border:0;background:none;padding:5px 0;display:flex;gap:6px;align-items:center}.action.liked{color:var(--danger)}.more{margin-left:auto!important;color:var(--muted)}
.search{display:flex;gap:9px;align-items:center;padding:12px 13px;border-radius:16px;background:var(--card);border:1px solid var(--line);margin:18px 0}.search input{width:100%;border:0;outline:0;background:none;color:#fff}.person{display:flex;align-items:center;gap:11px;padding:11px 0}.person>button.profile-hit{display:flex;gap:11px;align-items:center;min-width:0;flex:1;border:0;background:none;text-align:left;padding:0}.person-text{min-width:0}.person-text>*{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.primary,.secondary,.danger,.pill{border:0;font-weight:700}.primary{background:var(--accent);border-radius:15px;padding:13px 16px}.secondary{background:rgba(255,255,255,.07);border-radius:15px;padding:13px 16px}.danger{background:rgba(255,91,126,.14);color:#ff829b;border-radius:15px;padding:13px 16px}.pill{border-radius:999px;padding:9px 14px;background:var(--accent)}.pill.following{background:rgba(255,255,255,.08)}.full{width:100%}
.field{width:100%;border:1px solid var(--line);outline:none;background:var(--card);color:#fff;border-radius:15px;padding:13px}.field:focus{border-color:rgba(124,92,255,.65)}textarea.field{resize:none;min-height:118px}.stack{display:flex;flex-direction:column;gap:10px}.create-preview{margin-top:14px}.preview-img{width:100%;max-height:420px;object-fit:cover;border-radius:20px}.file-label{display:flex;justify-content:center;align-items:center;gap:8px;cursor:pointer}
.profile-hero{position:relative}.banner{height:170px;background:linear-gradient(135deg,#2d1f77,#a04cff);overflow:hidden}.banner img{width:100%;height:100%;object-fit:cover}.profile-body{padding:0 16px 20px}.profile-avatar-wrap{margin-top:-47px;width:98px;height:98px;border-radius:50%;border:4px solid var(--bg);overflow:hidden}.profile-avatar-wrap>*{width:100%!important;height:100%!important}.profile-top{display:flex;align-items:flex-end}.profile-actions{margin-left:auto;display:flex;gap:8px;padding-top:10px}.bio{white-space:pre-wrap;color:rgba(255,255,255,.8);line-height:1.4;margin-top:9px}.stats{display:flex;gap:24px;margin-top:14px}.stat b{margin-right:4px}.stat span{color:var(--muted);font-size:13px}.profile-posts{border-top:1px solid var(--line);margin-top:12px}
.inbox-row{display:flex;gap:12px;align-items:center;padding:12px;margin-bottom:9px;width:100%;text-align:left;color:#fff}.unread{min-width:20px;height:20px;border-radius:999px;background:var(--accent);display:grid;place-items:center;font-size:10px;font-weight:800}
.chat{position:fixed;z-index:60;top:var(--chat-vv-top,0px);bottom:var(--chat-vv-bottom,0px);left:50%;transform:translateX(calc(-50% + var(--chat-swipe-x,0px)));width:100%;max-width:640px;height:auto;padding-top:var(--safe-top);display:flex;flex-direction:column;background:var(--bg);overflow:hidden;transition:transform .18s ease,opacity .18s ease}.chat-head{display:flex;align-items:center;gap:10px;padding:9px 14px 12px;border-bottom:1px solid var(--line);flex:0 0 auto}.back{border:0;background:none;font-size:29px;padding:2px 8px 2px 0}.messages{flex:1;overflow:auto;padding:14px;display:flex;flex-direction:column;gap:8px}.bubble{max-width:79%;border-radius:18px;padding:10px 13px;line-height:1.36;white-space:pre-wrap;overflow-wrap:anywhere}.bubble.mine{align-self:flex-end;background:var(--accent);border-bottom-right-radius:6px}.bubble.theirs{align-self:flex-start;background:var(--card2);border-bottom-left-radius:6px}.chat-compose{display:flex;align-items:flex-end;gap:8px;padding:9px 12px calc(9px + var(--safe-bottom));border-top:1px solid var(--line);background:#0b0c11;flex:0 0 auto}.chat-compose textarea{flex:1;height:42px;min-height:42px;max-height:100px;overflow-y:auto;border:0;outline:0;border-radius:20px;padding:11px 14px;background:var(--card);color:#fff;resize:none}.send{width:42px;height:42px;border:0;border-radius:50%;background:var(--accent);font-size:20px}
.sheet-bg{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.58);display:flex;align-items:flex-end}.sheet{width:100%;max-height:90dvh;overflow:auto;background:#101219;border:1px solid var(--line);border-radius:26px 26px 0 0;padding:12px 16px calc(18px + var(--safe-bottom))}.handle{width:42px;height:5px;border-radius:9px;background:rgba(255,255,255,.2);margin:0 auto 16px}.sheet-title{font-size:25px;font-weight:800;margin:0 0 15px}.comment{display:flex;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}.comment-body{flex:1}.comment-text{margin-top:4px;white-space:pre-wrap}.menu-row{width:100%;border:0;background:none;text-align:left;padding:14px 2px;border-bottom:1px solid var(--line)}.menu-row.danger-text{color:#ff829b}
.toast{position:fixed;left:50%;bottom:calc(82px + var(--safe-bottom));z-index:250;transform:translate(-50%,18px);background:#20232e;border:1px solid var(--line);padding:11px 15px;border-radius:999px;opacity:0;pointer-events:none;transition:.2s;max-width:90vw;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.toast.show{opacity:1;transform:translate(-50%,0)}
.auth-page{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:calc(24px + var(--safe-top)) 18px calc(24px + var(--safe-bottom));background:radial-gradient(circle at 50% 18%,#24184b 0,#08090d 48%)}.auth-box{width:100%;max-width:430px}.auth-logo{display:flex;align-items:center;justify-content:center;gap:11px;font-size:31px;font-weight:900;letter-spacing:3px;margin-bottom:28px}.auth-logo .pulse-mark{width:42px;height:42px}.auth-tabs{display:flex;padding:4px;background:rgba(255,255,255,.06);border-radius:16px;margin-bottom:14px}.auth-tabs button{width:50%;border:0;background:none;padding:10px;border-radius:12px}.auth-tabs button.active{background:rgba(255,255,255,.09);font-weight:700}.error{color:#ff829b;font-size:13px;line-height:1.4}.loading{padding:50px 16px;text-align:center;color:var(--muted)}.spinner{width:28px;height:28px;border:3px solid rgba(255,255,255,.15);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 12px}@keyframes spin{to{transform:rotate(360deg)}}.empty{text-align:center;color:var(--muted);padding:42px 20px;line-height:1.5}.separator{height:1px;background:var(--line);margin:15px 0}.notice{padding:12px 13px;border-radius:15px;background:rgba(124,92,255,.1);border:1px solid rgba(124,92,255,.2);font-size:12px;line-height:1.5;color:#d8d1ff}
@media(min-width:700px){#page{border-left:1px solid var(--line);border-right:1px solid var(--line)}}

.link-btn{width:100%;border:0;background:transparent;color:#a997ff;text-align:center;padding:8px 4px;font-weight:700}
.link-btn:disabled{opacity:.45}
.muted-link{color:var(--muted)}
.auth-code-card{padding:20px}
.code-field{text-align:center;font-size:28px;letter-spacing:8px;font-weight:800}

.verified-badge{
  display:inline-flex;align-items:center;justify-content:center;
  width:17px;height:17px;border-radius:50%;
  background:#7c5cff;color:white;font-size:11px;font-weight:900;
  vertical-align:1px;line-height:1;box-shadow:0 0 0 2px rgba(124,92,255,.12)
}
.admin-row{display:flex;align-items:center;gap:10px}
.admin-chip{margin-left:auto;font-size:10px;font-weight:900;letter-spacing:.8px;padding:4px 7px;border-radius:999px;background:rgba(124,92,255,.16);color:#a997ff}
.admin-user-card{width:100%;display:flex;align-items:center;gap:12px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--text);padding:13px 2px;text-align:left}
.admin-profile-head{display:flex;align-items:center;gap:12px;margin:8px 0 20px}
.admin-toggle{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 0}
.admin-toggle span{display:flex;flex-direction:column;gap:4px}
.admin-toggle small{color:var(--muted);font-weight:400;line-height:1.35}
.admin-toggle input{width:24px;height:24px;accent-color:#7c5cff}

.mention-link{
  display:inline;
  border:0;
  background:transparent;
  color:#a997ff;
  padding:0;
  margin:0;
  font:inherit;
  font-weight:700;
  line-height:inherit;
  vertical-align:baseline;
  cursor:pointer;
}
.mention-link:active{opacity:.7}

/* Pulse V5.1 — DM timestamps and day separators */
.messages{
  display:flex;
  flex-direction:column;
}
.message-row{
  display:flex;
  width:100%;
  margin:2px 0;
}
.message-row.mine{justify-content:flex-end}
.message-row.theirs{justify-content:flex-start}
.message-row .bubble{
  margin:0;
  display:flex;
  flex-direction:column;
  gap:3px;
  max-width:min(78%,520px);
}
.message-text{
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
.message-time{
  font-size:10px;
  line-height:1;
  opacity:.58;
  align-self:flex-end;
  white-space:nowrap;
  margin-top:2px;
}
.chat-day{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  margin:18px 0 10px;
  color:var(--muted);
  font-size:12px;
  font-weight:700;
}
.chat-day span{
  padding:5px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.055);
  border:1px solid var(--line);
  text-transform:none;
}

/* Pulse V5.2 — Message reactions */
.message-stack{
  display:flex;
  flex-direction:column;
  max-width:min(78%,520px);
}
.message-stack.mine{align-items:flex-end}
.message-stack.theirs{align-items:flex-start}
.message-stack .bubble{max-width:100%}

.message-reactions{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  margin-top:-2px;
  position:relative;
  z-index:2;
}
.message-stack.mine .message-reactions{justify-content:flex-end}
.message-stack.theirs .message-reactions{justify-content:flex-start}

.reaction-pill{
  min-width:30px;
  height:25px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#171820;
  color:var(--text);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:3px;
  padding:2px 7px;
  font-size:14px;
  box-shadow:0 2px 10px rgba(0,0,0,.18);
}
.reaction-pill.mine{
  border-color:#7c5cff;
  background:rgba(124,92,255,.16);
}
.reaction-pill b{
  font-size:10px;
  color:var(--muted);
}

.reaction-overlay{
  position:fixed;
  inset:0;
  z-index:9999;
  background:rgba(0,0,0,.48);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:18px;
  backdrop-filter:blur(5px);
}
.reaction-pop{
  width:min(100%,460px);
  background:#15161d;
  border:1px solid var(--line);
  border-radius:24px;
  padding:16px;
  box-shadow:0 20px 60px rgba(0,0,0,.45);
}
.reaction-title{
  color:var(--muted);
  font-size:12px;
  font-weight:700;
  text-align:center;
  margin-bottom:12px;
}
.reaction-options{
  display:flex;
  justify-content:space-between;
  gap:5px;
}
.reaction-option{
  flex:1;
  min-width:0;
  aspect-ratio:1/1;
  max-height:54px;
  border:0;
  border-radius:16px;
  background:#20212a;
  font-size:25px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.reaction-option.selected{
  outline:2px solid #7c5cff;
  background:rgba(124,92,255,.18);
}
.reaction-option:active{transform:scale(.92)}
.reaction-remove{
  width:100%;
  margin-top:12px;
  border:0;
  border-radius:14px;
  padding:12px;
  background:#20212a;
  color:#ff7d87;
  font-weight:700;
}
.bubble[data-message-id]{
  -webkit-touch-callout:none;
}

/* Pulse V5.2.1 — real comment bubble icon */
.comment-action{
  display:inline-flex;
  align-items:center;
  gap:7px;
}
.comment-icon{
  width:24px;
  height:24px;
  flex:0 0 24px;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}


/* =======================================================
   PULSE V6
   ======================================================= */

/* Premium launch animation */
.pulse-splash{
  position:fixed;inset:0;z-index:99999;
  display:grid;place-items:center;
  background:
    radial-gradient(circle at 50% 45%,rgba(124,92,255,.18),transparent 30%),
    #07080c;
  overflow:hidden;
  transition:opacity .4s ease,visibility .4s ease;
}
.pulse-splash.hide{opacity:0;visibility:hidden;pointer-events:none}
.splash-core{position:relative;z-index:2;display:flex;align-items:center;gap:14px;animation:splashLift 1.05s cubic-bezier(.2,.8,.2,1) both}
.splash-mark{width:58px;height:58px;border:3px solid #7c5cff;border-radius:50%;display:grid;place-items:center;box-shadow:0 0 0 0 rgba(124,92,255,.45);animation:splashPulse 1.1s ease-out both}
.splash-mark i{width:10px;height:10px;border-radius:50%;background:#7c5cff;box-shadow:0 0 24px #7c5cff;animation:splashDot .7s .12s both}
.splash-word{font-size:35px;font-weight:950;letter-spacing:5px;color:white;opacity:0;transform:translateX(-8px);animation:splashWord .55s .28s ease-out forwards}
.splash-glow{position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(124,92,255,.14);filter:blur(60px);animation:splashGlow 1.2s ease-out both}
@keyframes splashPulse{0%{transform:scale(.65);opacity:0;box-shadow:0 0 0 0 rgba(124,92,255,.5)}55%{transform:scale(1.04);opacity:1;box-shadow:0 0 0 24px rgba(124,92,255,0)}100%{transform:scale(1)}}
@keyframes splashDot{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes splashWord{to{opacity:1;transform:none}}
@keyframes splashLift{from{transform:translateY(8px)}to{transform:none}}
@keyframes splashGlow{from{transform:scale(.6);opacity:0}to{transform:scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){
  .splash-core,.splash-mark,.splash-mark i,.splash-word,.splash-glow{animation:none!important}
  .splash-word{opacity:1;transform:none}
}

/* Unified bottom navigation */
.tabbar .tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.nav-icon{
  width:28px;height:28px;
  display:grid;place-items:center;
  color:inherit;
}
.nav-icon svg,.header-icon{
  width:26px;height:26px;
  fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;
}
.tab .nav-icon{transition:transform .18s ease,color .18s ease}
.tab.active .nav-icon{transform:translateY(-1px)}
.profile-tab-icon{
  border-radius:50%;
  overflow:hidden;
  border:2px solid transparent;
  transition:border-color .18s ease,transform .18s ease;
}
.tab.active .profile-tab-icon{border-color:currentColor}
.nav-profile-img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.header-account-btn{display:grid;place-items:center}

/* Feed actions: same visual weight */
.actions{align-items:center}
.post-action{display:inline-flex!important;align-items:center;gap:7px}
.post-action-icon{
  width:27px!important;height:27px!important;flex:0 0 27px;
  fill:none;stroke:currentColor;stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;
}
.action.liked{color:#ff6f91}
.action.liked .like-icon{fill:currentColor;stroke:currentColor}
.comment-icon{width:27px!important;height:27px!important;flex-basis:27px!important}
.share-action .post-action-icon{width:25px!important;height:25px!important}

/* Auth while browsing */
.auth-browse{margin-top:8px}

/* Image cropper */
.crop-state{min-height:0;color:#a997ff;font-size:12px;padding:0 3px}
.crop-overlay{
  position:fixed;inset:0;z-index:100000;
  background:rgba(3,4,7,.94);
  display:flex;align-items:center;justify-content:center;
  padding:calc(16px + var(--safe-top)) 16px calc(16px + var(--safe-bottom));
  backdrop-filter:blur(18px);
}
.crop-card{width:min(100%,520px);background:#101119;border:1px solid var(--line);border-radius:26px;padding:14px;box-shadow:0 24px 80px rgba(0,0,0,.55)}
.crop-head{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-bottom:16px}
.crop-head b{text-align:center;font-size:15px}
.crop-text-btn{border:0;background:none;color:#bbb;padding:8px;text-align:left;font-weight:700}
.crop-text-btn.accent{color:#a997ff;text-align:right}
.crop-canvas-wrap{
  position:relative;width:100%;aspect-ratio:4/1;
  overflow:hidden;border-radius:17px;background:#05060a;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
  touch-action:none;
}
.crop-canvas-wrap.round{width:min(82vw,390px);aspect-ratio:1/1;margin:0 auto;border-radius:50%}
.crop-canvas-wrap canvas{display:block;width:100%;height:100%;touch-action:none}
.crop-grid{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(to right,transparent 33.1%,rgba(255,255,255,.16) 33.3%,rgba(255,255,255,.16) 33.6%,transparent 33.8%,transparent 66.2%,rgba(255,255,255,.16) 66.4%,rgba(255,255,255,.16) 66.7%,transparent 66.9%),
  linear-gradient(to bottom,transparent 33.1%,rgba(255,255,255,.16) 33.3%,rgba(255,255,255,.16) 33.6%,transparent 33.8%,transparent 66.2%,rgba(255,255,255,.16) 66.4%,rgba(255,255,255,.16) 66.7%,transparent 66.9%)}
.crop-controls{display:flex;align-items:center;gap:12px;margin-top:18px}
.crop-controls input{flex:1;accent-color:#7c5cff}
.crop-controls span{color:var(--muted);font-weight:900}
.crop-hint{text-align:center;color:var(--muted);font-size:11px;margin-top:8px}

/* Admin reports */
.report-card{padding:14px 0;border-bottom:1px solid var(--line)}
.report-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.report-reason{margin:8px 0;line-height:1.45}
.report-snippet{padding:10px 12px;border-radius:13px;background:rgba(255,255,255,.045);margin:8px 0;color:#d5d5dd;line-height:1.4}
.report-actions{display:flex;gap:8px;margin-top:12px}
.report-actions .secondary{flex:1}

/* A tiny cue for public browsing */
.guest-cue{font-size:11px;color:var(--muted);font-weight:700}


/* Pulse V6.2.1 Stable — verified badge alignment */
.verified-badge{
  position:relative;
  top:-1px;
  vertical-align:middle!important;
  margin-left:2px;
}
.profile-body h2 .verified-badge{
  width:21px;
  height:21px;
  font-size:13px;
  top:-2px;
  margin-left:3px;
}

/* Exact shared-post view */
.single-post-page{min-height:100%;padding-bottom:24px}
.single-post-head{
  min-height:58px;
  padding:10px 16px;
  display:flex;
  align-items:center;
  gap:12px;
  border-bottom:1px solid var(--line);
}
.single-post-back{
  width:38px;height:38px;border-radius:50%;
  border:0;background:rgba(255,255,255,.06);
  color:var(--text);font-size:22px;
}
.single-post-card .post{border-bottom:0}

/* Double-tap photo like */
.post{position:relative}
.double-like-heart{
  position:absolute;
  left:50%;
  top:52%;
  width:92px;
  height:92px;
  z-index:8;
  pointer-events:none;
  opacity:0;
  transform:translate(-50%,-50%) scale(.25) rotate(-8deg);
  filter:drop-shadow(0 8px 24px rgba(0,0,0,.38));
}
.double-like-heart svg{
  width:100%;height:100%;
  fill:#fff;stroke:#fff;stroke-width:1.6;
  stroke-linecap:round;stroke-linejoin:round;
}
.double-like-heart.show{
  animation:pulseDoubleLike .65s cubic-bezier(.2,.85,.25,1.25) forwards;
}
.double-like-heart.out{
  animation:pulseDoubleLikeOut .25s ease forwards;
}
@keyframes pulseDoubleLike{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.25) rotate(-8deg)}
  40%{opacity:1;transform:translate(-50%,-50%) scale(1.15) rotate(3deg)}
  62%{transform:translate(-50%,-50%) scale(.92) rotate(0)}
  100%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(0)}
}
@keyframes pulseDoubleLikeOut{
  from{opacity:1;transform:translate(-50%,-50%) scale(1)}
  to{opacity:0;transform:translate(-50%,-55%) scale(1.14)}
}
.post-media{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}
@media(prefers-reduced-motion:reduce){
  .double-like-heart.show{animation:none;opacity:1;transform:translate(-50%,-50%) scale(1)}
  .double-like-heart.out{animation:none;opacity:0}
}


/* Pulse V7 — Push notifications */
.push-settings-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.push-status-card{
  display:flex;align-items:center;gap:12px;
  padding:15px;margin:8px 0 16px;
  border:1px solid var(--line);border-radius:18px;
  background:rgba(255,255,255,.035);
}
.push-status-dot{
  width:12px;height:12px;flex:0 0 12px;border-radius:50%;
  background:#777;box-shadow:0 0 0 5px rgba(255,255,255,.035);
}
.push-status-dot.on{
  background:#7c5cff;
  box-shadow:0 0 0 5px rgba(124,92,255,.14),0 0 18px rgba(124,92,255,.45);
}


/* Pulse V7.1 — Posts shared in DMs */
.bubble.has-shared-post{
  width:min(330px,82vw);
  max-width:min(330px,82vw);
  padding:7px;
}
.bubble.has-shared-post.mine{background:rgba(124,92,255,.16);border:1px solid rgba(124,92,255,.42)}
.bubble.has-shared-post.theirs{background:var(--card2);border:1px solid var(--line)}
.dm-post-card{
  display:block;width:100%;overflow:hidden;
  border:1px solid rgba(255,255,255,.11);border-radius:15px;
  background:#11131a;color:#fff;text-align:left;padding:0;
}
.dm-post-card.unavailable{padding:15px}
.dm-post-unavailable{color:var(--muted);font-size:14px;text-align:center}
.dm-post-author{display:flex;align-items:center;gap:9px;padding:11px 11px 8px}
.dm-post-author-copy{min-width:0;display:flex;flex-direction:column;line-height:1.2}
.dm-post-author-copy b{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-post-author-copy span{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-post-text{padding:2px 11px 10px;font-size:13px;line-height:1.35;white-space:pre-wrap;overflow-wrap:anywhere}
.dm-post-media{display:block;width:100%;max-height:230px;object-fit:cover;background:#0a0b0f;border-top:1px solid rgba(255,255,255,.08)}
.dm-post-open{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;color:#c9bcff;font-size:12px;font-weight:700;border-top:1px solid rgba(255,255,255,.08)}
.dm-post-open span{font-size:19px;line-height:10px}
.bubble.has-shared-post .message-time{padding:5px 5px 0}
.dm-share-section{display:flex;flex-direction:column;gap:10px}
.dm-share-title{font-size:14px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.dm-share-search{margin:0}
.dm-share-person{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line)}
.dm-share-profile{min-width:0;flex:1;display:flex;align-items:center;gap:10px;border:0;background:none;color:#fff;text-align:left;padding:0}
.dm-share-profile>div:last-child{min-width:0}
.dm-share-profile b,.dm-share-profile .username{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-share-send{
  border:0;border-radius:999px;padding:8px 13px;
  background:var(--accent);color:#fff;font-weight:800;
}
.dm-share-send:disabled{opacity:.55}
.dm-share-empty{padding:18px 4px;color:var(--muted);font-size:14px;text-align:center}


/* Pulse V7.1 — DM photos, replies and delete */
.dm-compose-extras{
  flex:0 0 auto;
  background:#0b0c11;
}
.dm-compose-reply,
.dm-compose-photo{
  margin:0 12px;
  border-top:1px solid var(--line);
}
.dm-compose-reply{
  min-height:52px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 4px 7px 10px;
  border-left:3px solid var(--accent);
}
.dm-compose-reply-copy{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.dm-compose-reply-copy b{
  color:#b9aaff;
  font-size:12px;
}
.dm-compose-reply-copy span{
  color:var(--muted);
  font-size:12px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.dm-compose-clear{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.07);
  color:var(--muted);
  font-size:22px;
  line-height:1;
}
.dm-compose-photo{
  padding:8px 0;
}
.dm-compose-photo-card{
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 8px;
  background:var(--card);
  border:1px solid var(--line);
  border-radius:15px;
}
.dm-compose-photo-card img{
  width:54px;
  height:54px;
  object-fit:cover;
  border-radius:11px;
}
.dm-compose-photo-card>div{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.dm-compose-photo-card b{font-size:13px}
.dm-compose-photo-card span{font-size:11px;color:var(--muted)}
.dm-photo-button{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.065);
}
.dm-photo-button svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.send:disabled{opacity:.45}
.bubble.has-dm-photo{
  padding:6px;
  max-width:min(310px,78vw);
  background:transparent;
}
.bubble.has-dm-photo.mine{
  background:rgba(124,92,255,.14);
  border:1px solid rgba(124,92,255,.38);
}
.bubble.has-dm-photo.theirs{
  background:var(--card2);
  border:1px solid var(--line);
}
.bubble.has-dm-photo .message-text{
  padding:5px 7px 7px;
}
.dm-photo-hit{
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:none;
  overflow:hidden;
  border-radius:14px;
}
.dm-message-photo{
  display:block;
  width:100%;
  max-height:380px;
  object-fit:cover;
  border-radius:14px;
  background:#111;
}
.bubble.has-dm-photo .message-time{
  padding:4px 5px 1px;
}
.dm-reply-quote{
  width:100%;
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  border:0;
  border-left:3px solid rgba(255,255,255,.58);
  border-radius:8px;
  padding:6px 8px;
  margin-bottom:4px;
  background:rgba(0,0,0,.16);
  color:inherit;
  text-align:left;
}
.dm-reply-quote b{
  font-size:11px;
  color:#d8d0ff;
}
.dm-reply-quote span{
  width:100%;
  color:rgba(255,255,255,.72);
  font-size:11px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.message-deleted{
  color:rgba(255,255,255,.5);
  font-style:italic;
  font-size:13px;
}
.bubble.deleted{
  background:rgba(255,255,255,.045);
  border:1px solid var(--line);
}
.dm-message-menu-sep{
  height:1px;
  background:var(--line);
  margin:12px 0 4px;
}
.dm-message-menu-row{
  width:100%;
  min-height:46px;
  display:flex;
  align-items:center;
  gap:10px;
  border:0;
  border-bottom:1px solid var(--line);
  background:none;
  padding:10px 4px;
  text-align:left;
  font-weight:700;
}
.dm-message-menu-row.danger-text{color:#ff829b}
.dm-message-flash{
  animation:dmMessageFlash .9s ease;
}
@keyframes dmMessageFlash{
  0%,100%{box-shadow:none}
  35%{box-shadow:0 0 0 4px rgba(124,92,255,.35)}
}
.dm-photo-overlay{
  position:fixed;
  inset:0;
  z-index:150;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.94);
  padding:calc(20px + var(--safe-top)) 14px calc(20px + var(--safe-bottom));
}
.dm-photo-overlay img{
  max-width:100%;
  max-height:88dvh;
  object-fit:contain;
  border-radius:10px;
}
.dm-photo-close{
  position:absolute;
  top:calc(12px + var(--safe-top));
  right:14px;
  z-index:2;
  width:40px;
  height:40px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.1);
  font-size:28px;
}
@media(prefers-reduced-motion:reduce){
  .dm-message-flash{animation:none}
}


/* Pulse V7.1.2 — deterministic DM composer on iOS */
.chat-compose textarea{
  box-sizing:border-box;
  transition:none;
  -webkit-overflow-scrolling:touch;
}


/* Pulse V7.1.3 — iOS visual viewport / keyboard gap fix */
body.chat-mode{
  overflow:hidden;
  overscroll-behavior:none;
}
#shell.chat-mode{
  min-height:0;
  height:100dvh;
  padding-bottom:0 !important;
  overflow:hidden;
}
html.dm-keyboard-open .chat-compose{
  /* iOS already places the visual viewport directly above the keyboard.
     Keeping safe-area-inset-bottom here creates a fake gap. */
  padding-bottom:9px;
}
html.dm-keyboard-open .dm-compose-extras{
  padding-bottom:0;
}


/* =======================================================
   PULSE V7.2 — DM typing / seen / copy / swipe
   ======================================================= */

/* DMs behave like a native messenger: no accidental text selection.
   Copy is deliberately exposed through the long-press message menu. */
.chat .bubble,
.chat .message-text,
.chat .message-deleted,
.chat .dm-reply-quote,
.chat .dm-post-card,
.chat .dm-post-text,
.chat .message-time,
.chat .dm-seen{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
}

/* Keep the composer itself selectable/editable. */
.chat-compose textarea{
  -webkit-user-select:text;
  user-select:text;
  -webkit-touch-callout:default;
}

.dm-typing-indicator{
  min-height:29px;
  flex:0 0 29px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:3px 15px 5px;
  color:var(--muted);
  font-size:11px;
  background:var(--bg);
}
.dm-typing-indicator.hidden{
  display:none;
}
.dm-typing-dots{
  height:22px;
  min-width:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  padding:0 9px;
  border-radius:13px;
  background:var(--card2);
  border:1px solid rgba(255,255,255,.055);
}
.dm-typing-dots i{
  width:4px;
  height:4px;
  border-radius:50%;
  background:rgba(255,255,255,.58);
  animation:dmTypingDot 1.15s ease-in-out infinite;
}
.dm-typing-dots i:nth-child(2){animation-delay:.13s}
.dm-typing-dots i:nth-child(3){animation-delay:.26s}
@keyframes dmTypingDot{
  0%,60%,100%{transform:translateY(0);opacity:.38}
  30%{transform:translateY(-2px);opacity:.95}
}

.dm-seen{
  padding:3px 5px 0;
  color:rgba(255,255,255,.48);
  font-size:10px;
  line-height:1;
  text-align:right;
  align-self:flex-end;
  letter-spacing:.01em;
}

/* Right -> left exit gesture. */
.chat.dm-swiping{
  transition:none;
  will-change:transform;
}
.chat.dm-swipe-exit{
  opacity:.35;
  transition:transform .18s cubic-bezier(.22,.8,.3,1),opacity .18s ease;
}
.messages,
.chat-head{
  touch-action:pan-y;
}

@media(prefers-reduced-motion:reduce){
  .dm-typing-dots i{animation:none}
  .chat{transition:none}
}


/* Pulse V7.2.1 — iOS viewport + horizontal navigation isolation */
html.chat-mode-root,
body.chat-mode{
  overscroll-behavior-x:none;
  overflow-x:hidden;
}

.chat{
  overscroll-behavior-x:none;
  touch-action:pan-y;
}

/* The composer sits directly at the bottom of the active visual viewport. */
html.dm-keyboard-open .chat-compose{
  padding-bottom:9px !important;
}

.chat.dm-swiping{
  transition:none !important;
  will-change:transform;
}


/* Pulse V7.2.2 — fixed-edge DM layout */
html:not(.dm-keyboard-open) .chat{
  top:0 !important;
  bottom:0 !important;
  height:auto !important;
}

/* Closed keyboard: composer reaches the real fixed bottom edge.
   Safe-area padding remains inside the composer, not below the chat. */
html:not(.dm-keyboard-open) .chat-compose{
  margin-bottom:0 !important;
}

/* Swipe now follows the native "back" direction: left -> right. */
.chat.dm-swipe-exit{
  opacity:.35;
}


/* ==========================================================
   Pulse V7.2.3 — iOS PWA hard DM viewport workaround
   ========================================================== */
html.chat-mode-root{
  width:100% !important;
  height:var(--chat-base-h,100%) !important;
  overflow:hidden !important;
  overscroll-behavior:none !important;
}
body.chat-mode{
  position:fixed !important;
  inset:0 !important;
  width:100% !important;
  height:var(--chat-base-h,100%) !important;
  min-height:0 !important;
  overflow:hidden !important;
  overscroll-behavior:none !important;
}
#shell.chat-mode{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  height:var(--chat-base-h,100%) !important;
  min-height:0 !important;
  padding-bottom:0 !important;
  overflow:hidden !important;
}
#shell.chat-mode #page{
  position:relative !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  margin:0 auto !important;
  overflow:hidden !important;
}

/* Avoid WebKit's broken fixed element after keyboard dismissal. */
#shell.chat-mode .chat{
  position:absolute !important;
  top:0 !important;
  bottom:auto !important;
  left:50% !important;
  width:100% !important;
  max-width:640px !important;
  height:calc(var(--chat-base-h,100%) - var(--chat-keyboard-h,0px)) !important;
  min-height:0 !important;
  transform:translateX(calc(-50% + var(--chat-swipe-x,0px))) !important;
  overflow:hidden !important;
  touch-action:pan-y !important;
}

html.dm-keyboard-open .chat-compose{
  padding-bottom:9px !important;
}

#shell.chat-mode .chat.dm-swiping{
  transition:none !important;
  will-change:transform;
}


/* ==========================================================
   Pulse V7.2.4 — Interactive swipe-back preview
   ========================================================== */

#shell.chat-mode #page{
  background:var(--bg);
}

/* Real Inbox-looking layer underneath the DM. */
.dm-swipe-backdrop{
  position:absolute;
  inset:0;
  z-index:1;
  width:100%;
  height:100%;
  overflow:hidden;
  background:var(--bg);
  pointer-events:none;
  transform:translateX(-18px) scale(.985);
  transform-origin:center center;
  opacity:.82;
  transition:transform .175s cubic-bezier(.22,.8,.3,1),opacity .175s ease;
}

#shell.chat-mode .chat{
  z-index:3 !important;
}

.dm-swiping + .nothing{
  display:none;
}

/* While the finger is moving, absolutely no easing: both screens track it. */
#shell.chat-mode:has(.chat.dm-swiping) .dm-swipe-backdrop{
  transition:none;
}

#shell.chat-mode .chat.dm-swiping,
#shell.chat-mode .chat.dm-swipe-exit{
  box-shadow:-14px 0 34px rgba(0,0,0,.34);
}

.dm-swipe-preview-header{
  height:calc(108px + var(--safe-top));
  padding:calc(20px + var(--safe-top)) 24px 18px;
  display:flex;
  align-items:flex-end;
  gap:14px;
  border-bottom:1px solid var(--line);
}
.dm-swipe-brand{
  display:flex;
  align-items:center;
  gap:11px;
  margin-right:auto;
  font-size:23px;
  letter-spacing:.08em;
}
.dm-swipe-logo{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border:2px solid var(--accent);
  border-radius:50%;
  box-shadow:0 0 24px rgba(124,92,255,.24);
}
.dm-swipe-logo:before{
  content:"";
  width:23px;
  height:23px;
  border:2px solid rgba(255,255,255,.92);
  border-radius:50%;
}
.dm-swipe-logo i{
  position:absolute;
}
.dm-swipe-social{
  margin-bottom:5px;
  padding:7px 13px;
  border-radius:999px;
  background:rgba(124,92,255,.15);
  color:#cfc4ff;
  font-size:11px;
  font-weight:800;
  letter-spacing:.12em;
}
.dm-swipe-bell{
  width:37px;
  height:37px;
  margin-bottom:2px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--card);
  color:#fff;
  font-size:19px;
}
.dm-swipe-preview-content{
  padding:24px 24px 120px;
}
.dm-swipe-preview-content h1{
  margin:0 0 21px;
  font-size:42px;
  line-height:1;
  letter-spacing:-.04em;
}
.dm-swipe-preview-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.dm-swipe-inbox-row{
  min-height:76px;
  display:flex;
  align-items:center;
  gap:13px;
  padding:12px 14px;
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--card);
}
.dm-swipe-inbox-copy{
  min-width:0;
  flex:1;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.dm-swipe-inbox-copy b{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:16px;
}
.dm-swipe-inbox-copy span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--muted);
  font-size:13px;
}
.dm-swipe-inbox-meta{
  flex:0 0 auto;
  color:var(--muted);
  font-size:12px;
}
.dm-swipe-new-message{
  margin-top:18px;
  min-height:52px;
  display:grid;
  place-items:center;
  border-radius:17px;
  background:rgba(255,255,255,.065);
  font-weight:800;
}
.dm-swipe-empty{
  padding:26px 10px;
  color:var(--muted);
  text-align:center;
}
.dm-swipe-placeholder{
  height:76px;
  border:1px solid var(--line);
  border-radius:22px;
  background:linear-gradient(90deg,var(--card),rgba(255,255,255,.055),var(--card));
  background-size:220% 100%;
  animation:dmSwipeSkeleton 1.3s ease-in-out infinite;
}
@keyframes dmSwipeSkeleton{
  from{background-position:100% 0}
  to{background-position:-100% 0}
}
.dm-swipe-preview-tabs{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:calc(82px + var(--safe-bottom));
  padding:10px 19px var(--safe-bottom);
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  border-top:1px solid var(--line);
  background:rgba(11,12,17,.97);
}
.dm-swipe-preview-tabs span{
  min-width:50px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
  color:var(--muted);
}
.dm-swipe-preview-tabs b{
  height:27px;
  font-size:24px;
  line-height:25px;
  font-weight:500;
}
.dm-swipe-preview-tabs small{
  font-size:10px;
}
.dm-swipe-preview-tabs .active{
  color:#fff;
}

@media(prefers-reduced-motion:reduce){
  .dm-swipe-backdrop{transition:none}
  .dm-swipe-placeholder{animation:none}
}


/* ==========================================================
   Pulse V7.2.5 — Exact Inbox snapshot during swipe
   ========================================================== */

.dm-swipe-backdrop.dm-swipe-real{
  transform:translateX(-12px);
  transform-origin:center center;
  opacity:1;
  background:var(--bg);
}

.dm-swipe-snapshot,
.dm-snapshot-shell{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:hidden;
  background:var(--bg);
}

/* Recreate the real #shell geometry exactly, while keeping the clone inert. */
.dm-snapshot-shell{
  min-height:100%;
  padding-bottom:calc(78px + var(--safe-bottom));
}

.dm-snapshot-shell > .topbar{
  position:sticky;
  top:0;
  z-index:30;
  width:100%;
}

.dm-snapshot-page{
  max-width:640px;
  margin:auto;
}

/*
  .tabbar is position:fixed in the actual app. Because the snapshot layer
  itself is transformed, CSS makes the cloned fixed bar use this layer as
  its containing block, so it stays aligned with the preview.
*/
.dm-snapshot-shell > .tabbar{
  display:flex !important;
}

/* Preview is purely visual; duplicated controls never intercept touches. */
.dm-swipe-snapshot *{
  pointer-events:none !important;
}

/* Remove the former fake-preview visual treatment. */
.dm-swipe-real .dm-swipe-preview-header,
.dm-swipe-real .dm-swipe-preview-content,
.dm-swipe-real .dm-swipe-preview-tabs{
  display:none !important;
}

/* During live drag there is no easing. */
#shell.chat-mode:has(.chat.dm-swiping) .dm-swipe-backdrop.dm-swipe-real{
  transition:none !important;
}

/* When cancelled/completed, only tiny parallax returns/finishes. */
.dm-swipe-backdrop.dm-swipe-real{
  transition:transform .175s cubic-bezier(.22,.8,.3,1);
}

@media(prefers-reduced-motion:reduce){
  .dm-swipe-backdrop.dm-swipe-real{transition:none}
}


/* Pulse V7.2.7 — Inbox one-tap reliability */
.inbox-row{
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}


/* ==========================================================
   Pulse V7.3.0 — Voice messages in DMs
   ========================================================== */
.dm-voice-button{
  width:40px;
  height:40px;
  flex:0 0 auto;
  border:none;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  color:#fff;
  display:grid;
  place-items:center;
  font-size:18px;
}
.dm-voice-button.recording{
  background:#c53b3b;
  color:#fff;
}
.dm-compose-audio-status,
.dm-compose-audio{
  margin-top:8px;
}
.dm-audio-status-card,
.dm-compose-audio-card{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--card);
}
.dm-audio-status-card{
  width:max-content;
}
.dm-audio-live-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#ff5050;
  box-shadow:0 0 0 4px rgba(255,80,80,.15);
}
.dm-compose-audio-card{
  gap:12px;
}
.dm-compose-audio-card audio{
  flex:1 1 auto;
  min-width:0;
  height:34px;
}
.dm-compose-audio-copy{
  display:flex;
  flex-direction:column;
  gap:2px;
  min-width:68px;
}
.dm-compose-audio-copy span{
  color:var(--muted);
  font-size:12px;
}

.dm-audio-wrap{
  margin-top:8px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.dm-audio-player{
  width:100%;
  height:40px;
}
.dm-audio-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  color:var(--muted);
  font-size:12px;
}
.bubble.has-dm-audio{
  min-width:240px;
}


/* ==========================================================
   Pulse V7.3.2 — Hold-to-record + real audio waveform
   ========================================================== */

.dm-voice-button{
  position:relative;
  width:42px;
  height:42px;
  flex:0 0 42px;
  padding:0;
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  background:rgba(255,255,255,.075);
  color:#f3f0ff;
  display:grid;
  place-items:center;
  touch-action:none;
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  transition:background .16s ease,border-color .16s ease,transform .12s ease,box-shadow .16s ease;
}
.dm-voice-button svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
  pointer-events:none;
}
.dm-voice-button:active,
.dm-voice-button.recording{
  transform:scale(.95);
}
.dm-voice-button.recording{
  color:#fff;
  background:linear-gradient(145deg,#8b62ff,#7047f5);
  border-color:rgba(174,149,255,.72);
  box-shadow:
    0 0 0 5px rgba(124,82,255,.12),
    0 0 22px rgba(124,82,255,.42);
}

.dm-audio-status-card{
  min-height:46px;
  padding:9px 13px;
  display:flex;
  align-items:center;
  gap:10px;
  border:1px solid rgba(128,88,255,.28);
  border-radius:17px;
  background:linear-gradient(180deg,rgba(124,82,255,.12),rgba(124,82,255,.065));
}
.dm-audio-live-dot{
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:#9b78ff;
  box-shadow:0 0 0 4px rgba(139,98,255,.14),0 0 14px rgba(139,98,255,.6);
}
.dm-live-wave{
  height:30px;
  min-width:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
}
.dm-live-wave i{
  display:block;
  width:4px;
  height:5px;
  border-radius:999px;
  background:linear-gradient(180deg,#d8ccff,#8f68ff);
  box-shadow:0 0 8px rgba(139,98,255,.28);
  transition:height .055s linear,opacity .055s linear;
}
.dm-record-time{
  margin-left:auto;
  color:var(--muted);
  font-variant-numeric:tabular-nums;
  font-size:13px;
}

/* The old emoji-era styling is intentionally overridden. */
.dm-voice-button.recording span{
  display:none;
}


/* ==========================================================
   Pulse V7.3.3 — Voice UX + full custom Pulse audio player
   ========================================================== */

/* Never expose Safari/iOS native audio controls. */
.dm-custom-audio-el{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.dm-audio-wrap{
  margin-top:6px;
}

.dm-custom-audio{
  position:relative;
  width:min(330px,72vw);
  min-width:218px;
  height:54px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 10px 7px 8px;
  border-radius:17px;
  background:rgba(0,0,0,.14);
  overflow:hidden;
}
.bubble.theirs .dm-custom-audio{
  background:rgba(255,255,255,.045);
}
.bubble.mine .dm-custom-audio{
  background:rgba(39,20,93,.42);
}

.dm-audio-play{
  width:40px;
  height:40px;
  flex:0 0 40px;
  border:0;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.12);
  color:#fff;
}
.dm-audio-play svg{
  width:20px;
  height:20px;
  fill:currentColor;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.dm-custom-audio.playing .dm-audio-play{
  background:rgba(255,255,255,.2);
}

.dm-audio-wave{
  position:relative;
  flex:1 1 auto;
  height:36px;
  min-width:92px;
  padding:0;
  border:0;
  background:transparent;
  overflow:hidden;
}
.dm-audio-wave-base,
.dm-audio-wave-progress{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:2px;
}
.dm-audio-wave-base i,
.dm-audio-wave-progress i{
  display:block;
  width:3px;
  height:var(--voice-h,8px);
  flex:0 0 3px;
  border-radius:999px;
}
.dm-audio-wave-base i{
  background:rgba(255,255,255,.28);
}
.dm-audio-wave-progress{
  clip-path:inset(0 100% 0 0);
}
.dm-audio-wave-progress i{
  background:#fff;
}
.bubble.theirs .dm-audio-wave-progress i{
  background:#9b79ff;
}

.dm-audio-clock{
  min-width:34px;
  flex:0 0 auto;
  color:rgba(255,255,255,.72);
  font-size:12px;
  font-variant-numeric:tabular-nums;
  text-align:right;
}

.dm-compose-audio-card{
  display:block;
  padding:10px;
}
.dm-compose-audio-top{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:8px;
}
.dm-compose-audio-top b{
  font-size:13px;
}
.dm-compose-audio-top span{
  color:var(--muted);
  font-size:12px;
}
.dm-compose-audio-top .dm-compose-clear{
  margin-left:auto;
}
.dm-compose-audio-card .dm-custom-audio{
  width:100%;
  max-width:none;
  background:rgba(124,82,255,.11);
}

/* Hold gesture */
.dm-voice-button.holding{
  transform:scale(1.12);
  box-shadow:
    0 0 0 8px rgba(124,82,255,.12),
    0 0 30px rgba(124,82,255,.45);
}
.chat-compose.voice-holding{
  user-select:none;
  -webkit-user-select:none;
}

.dm-audio-status-card.holding{
  width:100%;
}
.dm-record-hint{
  font-size:12px;
  color:var(--muted);
  white-space:nowrap;
  transition:color .12s ease,transform .12s ease,opacity .12s ease;
}
.dm-record-hint.cancel-hint{
  margin-left:3px;
}
.dm-record-hint.lock-hint{
  margin-left:auto;
}

#dmAudioStatus.cancel-ready .cancel-hint{
  color:#ff6b78;
  transform:translateX(-4px);
}
#dmAudioStatus.lock-ready .lock-hint{
  color:#c7b7ff;
  transform:translateY(-3px);
}

.dm-voice-button.cancel-ready{
  background:#852d3d !important;
  border-color:rgba(255,107,120,.65) !important;
  box-shadow:0 0 0 7px rgba(255,76,94,.12) !important;
}
.dm-voice-button.lock-ready{
  background:#7650ef !important;
  box-shadow:0 0 0 7px rgba(124,82,255,.18),0 0 26px rgba(124,82,255,.5) !important;
}

/* Locked hands-free mode */
.dm-audio-status-card.locked{
  width:100%;
  min-height:54px;
}
.dm-record-lock{
  width:26px;
  height:26px;
  display:grid;
  place-items:center;
  color:#cfc2ff;
  font-size:20px;
}
.dm-locked-delete,
.dm-locked-send{
  width:38px;
  height:38px;
  flex:0 0 38px;
  border-radius:50%;
  display:grid;
  place-items:center;
}
.dm-locked-delete{
  border:1px solid rgba(255,101,117,.24);
  background:rgba(255,76,94,.1);
  color:#ff7a87;
}
.dm-locked-send{
  border:1px solid rgba(159,129,255,.42);
  background:#7c52ff;
  color:#fff;
}
.dm-locked-delete svg,
.dm-locked-send svg{
  width:19px;
  height:19px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Sending state */
.dm-audio-status-card.sending{
  width:max-content;
}
.dm-audio-sending-spinner{
  width:17px;
  height:17px;
  border:2px solid rgba(255,255,255,.22);
  border-top-color:#9b79ff;
  border-radius:50%;
  animation:dmVoiceSpin .7s linear infinite;
}
@keyframes dmVoiceSpin{to{transform:rotate(360deg)}}

@media(max-width:420px){
  .dm-record-hint{font-size:11px}
  .dm-audio-status-card.holding{gap:7px}
}


/* ==========================================================
   Pulse V7.3.4 — voice fixes / bubble fit / actual waveforms
   ========================================================== */
.bubble.has-dm-audio{
  min-width:min(240px,100%);
}
.dm-audio-wrap{
  width:100%;
  max-width:100%;
}
.dm-custom-audio{
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}
.dm-audio-wave{
  min-width:0;
}
.dm-audio-wave-base,
.dm-audio-wave-progress{
  gap:clamp(1px,.45vw,4px);
}
.dm-audio-wave-base i,
.dm-audio-wave-progress i{
  width:4px;
  flex:0 0 4px;
  max-height:26px;
}
.dm-audio-clock{
  margin-left:4px;
}
.bubble.mine .dm-custom-audio,
.bubble.theirs .dm-custom-audio{
  border-radius:20px;
}
#dmAudioStatus.cancel-ready .cancel-hint{
  color:#ff6b78;
  transform:translateX(4px);
}


/* ==========================================================
   Pulse V7.3.5 — Larger voice messages
   ========================================================== */

/* Give audio bubbles a proper, consistent width again. */
.message-stack:has(.bubble.has-dm-audio){
  width:min(350px,78%);
}

.bubble.has-dm-audio{
  width:100%;
  min-width:0;
  max-width:100%;
  box-sizing:border-box;
}

.bubble.has-dm-audio .dm-audio-wrap{
  width:100%;
  max-width:100%;
}

.bubble.has-dm-audio .dm-custom-audio{
  width:100%;
  min-width:0;
  max-width:100%;
  height:60px;
  padding:8px 12px 8px 9px;
  gap:11px;
}

.bubble.has-dm-audio .dm-audio-play{
  width:44px;
  height:44px;
  flex-basis:44px;
}

.bubble.has-dm-audio .dm-audio-play svg{
  width:21px;
  height:21px;
}

.bubble.has-dm-audio .dm-audio-wave{
  flex:1 1 auto;
  min-width:120px;
  height:40px;
}

.bubble.has-dm-audio .dm-audio-wave-base i,
.bubble.has-dm-audio .dm-audio-wave-progress i{
  width:4px;
  flex:0 0 4px;
}

.bubble.has-dm-audio .dm-audio-clock{
  min-width:38px;
  font-size:13px;
}

/* Keep it balanced on narrower iPhones. */
@media(max-width:390px){
  .message-stack:has(.bubble.has-dm-audio){
    width:min(326px,80%);
  }

  .bubble.has-dm-audio .dm-audio-wave{
    min-width:96px;
  }
}