html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}
body{
  overscroll-behavior:none;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
button, input, textarea, select{
  font:inherit;
}
input, textarea, select{
  font-size:16px;
}
button, .btn, .item, .tab, .icon-btn, .fab, .newmsgs{
  touch-action:manipulation;
}

:root{
  --bg:#f5efe6;
  --panel:#f7f2ea;
  --panel2:#efe6d8;
  --border:rgba(125, 101, 74, .16);
  --text:#5e5145;
  --muted:#8a7868;
  --muted2:#aa967d;
  --accent:#9fb6cf;
  --danger:#c97d7d;
  --ok:#b39b7a;
  --radius:14px;
  --shadow:0 12px 30px rgba(121, 100, 78, .12);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Inter,Ubuntu,"Helvetica Neue",Arial,"Noto Sans",sans-serif;

  /* theme-ready chat bubble tokens */
  --bubble-in-bg:rgba(255,255,255,.045);
  --bubble-in-border:rgba(255,255,255,.08);
  --bubble-in-text:var(--text);
  --bubble-in-time:var(--muted2);
  --bubble-in-glow-core:rgba(110, 178, 255, .22);
  --bubble-in-glow-soft:rgba(110, 178, 255, .08);

  --bubble-out-bg-start:rgba(79,140,255,.18);
  --bubble-out-bg-end:rgba(79,140,255,.12);
  --bubble-out-border:rgba(79,140,255,.35);
  --bubble-out-text:var(--text);
  --bubble-out-time:rgba(220,232,255,.82);
  --bubble-out-glow-core:rgba(255, 208, 120, .30);
  --bubble-out-glow-soft:rgba(103, 155, 255, .14);

  --bubble-glow-opacity:.72;
  --bubble-glow-blur:20px;
  --bubble-glow-height:22px;
  --bubble-glow-lift:-7px;
  --bubble-hover-lift:-1px;
}

body[data-theme="midnight"]{
  --bubble-in-bg:rgba(255,255,255,.045);
  --bubble-in-border:rgba(255,255,255,.08);
  --bubble-in-text:var(--text);
  --bubble-in-time:var(--muted2);
  --bubble-in-glow-core:rgba(88, 167, 255, .24);
  --bubble-in-glow-soft:rgba(88, 167, 255, .09);

  --bubble-out-bg-start:rgba(79,140,255,.18);
  --bubble-out-bg-end:rgba(79,140,255,.12);
  --bubble-out-border:rgba(79,140,255,.35);
  --bubble-out-text:var(--text);
  --bubble-out-time:rgba(220,232,255,.82);
  --bubble-out-glow-core:rgba(255, 210, 120, .34);
  --bubble-out-glow-soft:rgba(96, 146, 255, .14);
}

body[data-theme="warm-sand"]{
  --bubble-in-bg:rgba(255,248,241,.92);
  --bubble-in-border:rgba(172,140,107,.18);
  --bubble-in-text:#5e5145;
  --bubble-in-time:#9d866e;
  --bubble-in-glow-core:rgba(182, 160, 131, .22);
  --bubble-in-glow-soft:rgba(182, 160, 131, .08);

  --bubble-out-bg-start:#d3b48d;
  --bubble-out-bg-end:#c8a97f;
  --bubble-out-border:rgba(160,126,88,.28);
  --bubble-out-text:#4e4034;
  --bubble-out-time:#745d49;
  --bubble-out-glow-core:rgba(241, 211, 154, .34);
  --bubble-out-glow-soft:rgba(196, 156, 112, .14);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; font-family:var(--font);
  color:var(--text);
  background: linear-gradient(180deg, #f8f5ef 0%, #efe7db 100%) fixed;
}

a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}

.app{
  height:100%;
  display:flex;
}

.sidebar{
  width:360px;
  max-width:92vw;
  background: linear-gradient(180deg, var(--panel) 0%, var(--panel2) 100%);
  border-right:1px solid var(--border);
  display:flex;
  flex-direction:column;
}

.topbar{
  padding:14px 14px 10px 14px;
  display:flex;
  align-items:center;
  gap:10px;
}

.brand{
  display:flex; align-items:center; gap:10px;
  font-weight:700; letter-spacing:.2px;
}

.pill{
  font-size:12px;
  color:var(--muted);
  border:1px solid var(--border);
  padding:4px 8px;
  border-radius:999px;
}

.search{
  padding:0 14px 12px 14px;
}
.search input{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  color:var(--text);
  outline:none;
}

.actions{
  padding:0 14px 12px 14px;
  display:flex; gap:10px;
}
.btn{
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  color:var(--text);
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  font-weight:600;
  display:inline-flex; align-items:center; justify-content:center;
  gap:8px;
}
.btn.primary{background:rgba(79,140,255,.16); border-color:rgba(79,140,255,.35)}
.btn.danger{background:rgba(255,79,109,.12); border-color:rgba(255,79,109,.35); color:#ffd4dc}
.btn:active{transform:translateY(1px)}
.btn.small{padding:8px 10px; border-radius:10px; font-size:13px}

.list{
  overflow:auto;
  padding:6px;
  flex:1;
}
.item{
  padding:12px 12px;
  border-radius:12px;
  display:flex; align-items:center; gap:10px;
  cursor:pointer;
}
.item:hover{background:rgba(255,255,255,.04)}
.item.active{background:rgba(79,140,255,.14); border:1px solid rgba(79,140,255,.25)}
.avatar{
  width:40px; height:40px; border-radius:50%;
  background:rgba(255,255,255,.06);
  border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  flex:0 0 auto;
  overflow:hidden;
}
.avatar img{width:100%; height:100%; object-fit:cover}

.avatar.sm{ width:32px; height:32px; font-size:12px; }
.profileBtn{ display:flex; align-items:center; gap:8px; padding:6px 10px; }
.profileBtn span:last-child{ max-width:120px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.avatarPlaceholder{ font-weight:800; }
.profileHero{ display:flex; gap:14px; align-items:center; margin-bottom:14px; }
.profileAvatarLarge{ width:72px; height:72px; font-size:24px; }
.profileMeta{ min-width:0; }
.profileMetaTitle{ font-size:16px; font-weight:800; margin-bottom:4px; }
.profileGrid{ display:grid; gap:12px; }
.profileActionsInline{ display:flex; gap:10px; flex-wrap:wrap; }
.profileChecks{ display:grid; gap:10px; margin-top:4px; }
.profileChecks label{ display:flex; align-items:center; gap:10px; margin-bottom:0; font-size:14px; opacity:1; }
.profileChecks input[type="checkbox"]{ width:auto; transform:scale(1.15); }
.meta{min-width:0; flex:1}
.name{font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.sub{font-size:12px; color:var(--muted2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px}
.badge{font-size:12px; color:var(--muted2)}

.main{
  flex:1;
  display:flex;
  flex-direction:column;
  min-width:0;
}

.header{
  height:60px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 14px;
  border-bottom:1px solid var(--border);
  background:rgba(10,14,26,.55);
  backdrop-filter: blur(8px);
}

.peer{
  display:flex; align-items:center; gap:10px; min-width:0;
}
.peer .title{font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.peer .hint{font-size:12px; color:var(--muted2)}

.header .right{display:flex; align-items:center; gap:10px}

.lock{
  font-size:12px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  color:var(--muted);
  display:inline-flex; gap:8px; align-items:center;
}
.lock.ok{border-color:rgba(179,155,122,.28); background:rgba(179,155,122,.10); color:#8e7759}
.lock.open{border-color:rgba(201,168,122,.28); background:rgba(201,168,122,.10); color:#9b7b52}

.messages{
  flex:1;
  overflow:auto;
  padding:16px 14px 10px 14px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.bubble{
  max-width:min(560px, 90%);
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  box-shadow: var(--shadow);
}
.bubble.me{
  align-self:flex-end;
  background:rgba(79,140,255,.14);
  border-color:rgba(79,140,255,.25);
}
.bubble .text{white-space:pre-wrap; word-break:break-word}
.bubble .time{margin-top:6px; font-size:11px; color:var(--muted2); text-align:right}

.composer{
  padding:10px 10px calc(10px + env(safe-area-inset-bottom)) 10px;
  border-top:1px solid var(--border);
  background:rgba(10,14,26,.7);
  backdrop-filter: blur(8px);
  display:flex; gap:10px; align-items:flex-end;
}
.composer textarea{
  flex:1;
  resize:none;
  max-height:140px;
  min-height:44px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  color:var(--text);
  outline:none;
}
.composer .send{height:44px; min-width:90px}

.empty{
  flex:1;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:30px;
}
.emptyCard{
  width:min(560px, 92%);
  border:1px solid var(--border);
  background:rgba(255,255,255,.03);
  border-radius:16px;
  padding:18px;
  box-shadow: var(--shadow);
}
.emptyCard h2{margin:0 0 8px 0; font-size:18px}
.emptyCard p{margin:0 0 14px 0; color:var(--muted)}
.emptyRow{display:flex; gap:10px; flex-wrap:wrap}


@media (max-width: 720px){
  .modal.wide{ max-width:none; }
  .peerProfileHero{ grid-template-columns:1fr; text-align:center; }
.peerProfileAvatarHero{ display:flex; justify-content:center; }
button.peerProfileAvatarHero{appearance:none;width:100%;padding:0;border:0;background:transparent;color:inherit;cursor:pointer;}
button.peerProfileAvatarHero:disabled{cursor:default;}
#peerAvatar:has(img){cursor:pointer;}
  .peerProfileMiniStats{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .peerMediaGrid{ grid-template-columns:repeat(3, minmax(0,1fr)); }
}

.toast{
  position:fixed;
  left:50%;
  transform:translateX(-50%);
  bottom:14px;
  background:rgba(0,0,0,.55);
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
  padding:10px 12px;
  border-radius:12px;
  max-width:min(520px, 92%);
  display:none;
}

@media (max-width: 860px){
  .sidebar{width:320px}
}
@media (max-width: 720px){
  .sidebar{width:100%}
  .main{display:none}
  .app.mobile-chat .sidebar{display:none}
  .app.mobile-chat .main{display:flex}
  .header{height:56px}
}


.hidden { display:none !important; }

.modal-overlay{
  position:fixed; inset:0;
  background:rgba(0,0,0,0.45);
  display:flex; align-items:center; justify-content:center;
  padding:16px;
  z-index:1000;
}
.modal{
  width:100%;
  max-width:420px;
  max-height:min(92vh, calc(100dvh - 32px));
  display:flex;
  flex-direction:column;
  background:var(--card,#111);
  border:1px solid rgba(255,255,255,0.10);
  border-radius:14px;
  box-shadow:0 20px 60px rgba(0,0,0,0.35);
  overflow:hidden;
}
.modal-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 14px 10px;
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.modal-title{ font-weight:700; font-size:16px; }
.modal-body{ padding:14px; flex:1 1 auto; min-height:0; overflow:auto; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; }
.modal-actions{
  display:flex; gap:10px; justify-content:flex-end;
  padding:12px 14px 14px;
  border-top:1px solid rgba(255,255,255,0.08);
  flex:0 0 auto;
}
.modal-body label{ display:block; font-size:12px; opacity:0.8; margin-bottom:6px; }
.modal-body input{
  width:100%;
  padding:12px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.04);
  color:inherit;
  outline:none;
}
.modal-body .hint{ font-size:12px; opacity:0.7; margin-top:8px; line-height:1.25; }
.btn-secondary{
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.12);
  color:inherit;
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
}
.toast{
  position:fixed;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  background:rgba(0,0,0,0.85);
  border:1px solid rgba(255,255,255,0.12);
  color:#fff;
  padding:10px 12px;
  border-radius:12px;
  font-size:13px;
  z-index:1100;
  max-width:min(520px, calc(100% - 24px));
  text-align:center;
}
.chatlist-item{
  position:relative;
}
.chatlist-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-top:2px;
  font-size:12px;
  opacity:0.75;
}
.badge{
  min-width:18px;
  height:18px;
  padding:0 6px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:700;
  background:rgba(255,255,255,0.14);
  border:1px solid rgba(255,255,255,0.18);
}
.badge.hidden{ display:none; }


/* Floating actions in chat */
.fab{
  position:absolute;
  right:14px;
  bottom:86px;
  width:44px;
  height:44px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(17,28,51,.9);
  color:var(--text);
  box-shadow:var(--shadow);
  display:none;
  align-items:center;
  justify-content:center;
  z-index:40;
}
.fab.show{ display:flex; }

.newmsgs{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:92px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(79,140,255,.18);
  color:var(--text);
  display:none;
  z-index:40;
}
.newmsgs.show{ display:inline-flex; gap:8px; align-items:center; }
.newmsgs span{
  display:inline-flex;
  min-width:20px;
  height:20px;
  padding:0 7px;
  border-radius:999px;
  background:rgba(79,140,255,.35);
  align-items:center;
  justify-content:center;
  font-size:12px;
}

/* Empty/loading/error states */
.statebox{
  margin:auto;
  max-width:440px;
  padding:18px 18px;
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:rgba(15,23,42,.6);
  color:var(--muted);
  text-align:center;
}
.statebox .title{ color:var(--text); font-weight:700; margin-bottom:8px; }
.statebox .actions{ margin-top:14px; display:flex; gap:10px; justify-content:center; flex-wrap:wrap; }



/* Avatars */
.avatarCircle{
  width:36px; height:36px;
  border-radius:999px;
  border:1px solid var(--border);
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:800;
  font-size:13px;
  color:var(--text);
  background:rgba(148,163,184,.12);
  flex:0 0 auto;
}
.avatarCircle.sm{ width:28px; height:28px; font-size:12px; }

.msgrow{
  display:flex;
  gap:10px;
  align-items:flex-end;
  margin:4px 0;
}
.msgrow.me{ justify-content:flex-end; }
.msgcol{ display:flex; flex-direction:column; gap:4px; }
.msgmeta{ display:flex; gap:8px; align-items:center; justify-content:flex-end; color:var(--muted); font-size:12px; padding:0 6px; }
.msgstatus{ font-size:12px; opacity:.9; }
.msgstatus.failed{ opacity:1; }
.msgstatus button{
  border:1px solid var(--border);
  background:transparent;
  color:var(--text);
  border-radius:8px;
  padding:4px 8px;
}

.daysep{
  display:flex;
  justify-content:center;
  margin:10px 0;
}
.daysep .pill{
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--border);
  background:rgba(15,23,42,.55);
  color:var(--muted);
  font-size:12px;
}

.bubble.groupTop{ border-top-left-radius:12px; border-top-right-radius:12px; }
.bubble.groupMid{ border-top-left-radius:12px; border-top-right-radius:12px; border-bottom-left-radius:12px; border-bottom-right-radius:12px; }
.bubble.groupBot{ border-bottom-left-radius:12px; border-bottom-right-radius:12px; }


.peerSubtitle{
  font-size:12px;
  color:var(--muted);
  margin-top:2px;
}
.msgstatus.read{ font-weight:800; }


.presenceDot{
  display:inline-block;
  width:8px;height:8px;
  border-radius:999px;
  background: var(--accent);
  margin-right:6px;
  transform: translateY(-1px);
}
.msgstatus.delivered{ opacity:0.75; }
.msgstatus.read{ opacity:1; font-weight:800; }


.composerRow{ display:flex; gap:10px; align-items:flex-end; width:100%; }
.icon-btn.attach{ width:42px; height:42px; border-radius:12px; }
.attachPreview{
  display:flex;
  gap:10px;
  padding:10px;
  margin-bottom:8px;
  background: rgba(0,0,0,0.04);
  border-radius:14px;
  overflow-x:auto;
}
.attachPreview.hidden{ display:none; }
.apItem{
  position:relative;
  width:84px; height:84px;
  border-radius:14px;
  overflow:hidden;
  flex:0 0 auto;
  background: rgba(0,0,0,0.08);
  display:flex; align-items:center; justify-content:center;
}
.apItem img, .apItem video{
  width:100%; height:100%; object-fit:cover;
}
.apItem .apName{
  font-size:11px;
  padding:6px;
  text-align:center;
}
.apItem .apRemove{
  position:absolute; top:6px; right:6px;
  width:22px; height:22px;
  border-radius:999px;
  border:none;
  background: rgba(0,0,0,0.45);
  color:#fff;
  cursor:pointer;
}
.fileCard{ display:flex; gap:10px; align-items:center; }
.fileCard .fi{ width:38px; height:38px; border-radius:12px; background: rgba(0,0,0,0.08); display:flex; align-items:center; justify-content:center; }
.fileCard .fn{ font-weight:700; }
.fileCard .fs{ font-size:12px; opacity:0.75; margin-top:2px; }
.uploadBar{ height:6px; border-radius:99px; background: rgba(0,0,0,0.12); overflow:hidden; margin-top:10px; }
.uploadBar > div{ height:100%; width:0%; background: var(--accent); }
.uploadActions{ display:flex; gap:8px; margin-top:8px; }
.uploadActions button{ border:none; background: rgba(0,0,0,0.08); border-radius:10px; padding:6px 10px; cursor:pointer; }


/* Chat info drawer */
.drawer{
  position:fixed;
  top:0; right:0;
  width:min(420px, 100vw);
  height:100vh;
  background: var(--panel);
  border-left: 1px solid rgba(255,255,255,0.08);
  z-index: 50;
  display:flex;
  flex-direction:column;
}
.drawer.hidden{ display:none; }
.drawerHeader{
  display:flex;
  gap:10px;
  align-items:center;
  padding:12px;
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.drawerTitle{ font-weight:800; }
.drawerHint{ opacity:0.75; font-size:12px; }
.drawerBody{
  padding:12px;
  overflow:auto;
  flex:1;
}
.tabs{
  display:flex;
  gap:8px;
  padding:10px 12px;
  border-bottom:1px solid rgba(255,255,255,0.08);
}
.tab{
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,0.10);
  background: transparent;
  color: inherit;
  cursor:pointer;
  font-weight:700;
  font-size:13px;
}
.tab.active{
  background: rgba(255,255,255,0.10);
  border-color: rgba(255,255,255,0.18);
}
.tabPane.hidden{ display:none; }
.btn.full{ width:100%; }

.mediaGrid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:8px;
}
.mediaItem{
  width:100%;
  aspect-ratio: 1 / 1;
  border-radius:12px;
  overflow:hidden;
  background: rgba(255,255,255,0.06);
  display:flex;
  align-items:center;
  justify-content:center;
}
.mediaItem img, .mediaItem video{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.fileRow{
  display:flex;
  gap:10px;
  align-items:center;
  padding:10px;
  border:1px solid rgba(255,255,255,0.10);
  border-radius:12px;
  margin-bottom:8px;
}
.fileRow .name{ font-weight:800; }
.fileRow .meta{ opacity:0.75; font-size:12px; }
.linkRow{
  padding:10px;
  border:1px solid rgba(255,255,255,0.10);
  border-radius:12px;
  margin-bottom:8px;
}
.linkRow a{ word-break: break-all; }


/* Voice messages */
.voiceCard{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;
  padding: 10px 12px;
  max-width: 320px;
}
.voiceCard .vh{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  margin-bottom:6px;
}
.voiceCard .vt{ font-weight: 650; font-size: 13px; }
.voiceCard .vm{ opacity:.7; font-size: 12px; }
.voiceCard audio{ width: 100%; height: 32px; }

/* Mic button */
.icon-btn.mic{
  width: 40px; height: 40px;
  border-radius: 12px;
}

/* Recording overlay */
.recOverlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding: 18px;
  z-index: 50;
}
.recCard{
  width: min(520px, 100%);
  background: rgba(24,26,30,.95);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 18px 60px rgba(0,0,0,.5);
}
.recTop{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom: 10px;
}
.recDot{
  width:10px; height:10px; border-radius:999px;
  background: #ff4d4f;
  box-shadow: 0 0 0 6px rgba(255,77,79,.18);
}
.recTitle{ font-weight:700; }
.recActions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  margin-top: 10px;
}


/* video-fix: keep hidden overlays from intercepting clicks */
.drawer.hidden,
.modal-overlay.hidden,
.recOverlay.hidden,
.newmsgs:not(.show),
.fab:not(.show){
  pointer-events: none !important;
}
.drawer,
.modal-overlay,
.recOverlay,
.fab,
.newmsgs{
  pointer-events: auto;
}
.sidebar .actions, .emptyRow{
  position: relative;
  z-index: 5;
}
.header, .sidebar, .main{
  position: relative;
}
.peer{ cursor:pointer; }

.modal.wide{ max-width:760px; }
.peerProfileModal .modal-title{ font-size:18px; }
.peerProfileBody{ padding:16px; }
.peerProfileCard.advanced{ display:grid; gap:16px; }
.peerProfileHero{
  display:grid;
  grid-template-columns:120px minmax(0,1fr);
  gap:18px;
  align-items:center;
}
.peerProfileAvatarHero .avatar{ width:120px; height:120px; border-radius:28px; }
.peerProfileAvatar.xl{ width:120px; height:120px; font-size:42px; border-radius:28px; }
.peerProfileHeroMeta{ min-width:0; display:grid; gap:10px; }
.peerProfileMiniStats{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px; }
.peerStat{
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  padding:12px 10px;
  display:grid;
  gap:4px;
  text-align:center;
}
.peerStat strong{ font-size:18px; line-height:1; }
.peerStat span{ font-size:12px; color:var(--muted2); }
.peerCardSection{
  display:grid;
  gap:10px;
  padding:14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(255,255,255,.03);
}
.peerSectionTitle{ font-size:15px; font-weight:800; }
.peerSectionHint{ font-size:12px; color:var(--muted2); line-height:1.35; }
.peerTabs{ display:flex; gap:8px; flex-wrap:wrap; }
.peerTab{
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03);
  color:inherit;
  border-radius:12px;
  padding:9px 12px;
  cursor:pointer;
  font-weight:700;
}
.peerTab.active{ background:rgba(79,140,255,.16); border-color:rgba(79,140,255,.35); }
.peerTabPane.hidden{ display:none; }
.peerMediaGrid{ display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px; }
.peerMediaItem{ position:relative; display:block; aspect-ratio:1/1; border-radius:16px; overflow:hidden; background:rgba(255,255,255,.55); border:0; padding:0; width:100%; cursor:pointer; }
.peerMediaItem img, .peerMediaItem video{ width:100%; height:100%; object-fit:cover; display:block; }
.peerMediaBadge{
  position:absolute; right:8px; bottom:8px;
  padding:4px 8px; border-radius:999px;
  background:rgba(0,0,0,.55); color:#fff; font-size:11px;
}
.peerFilesList, .peerLinksList{ display:grid; gap:8px; }
.peerFileRow, .peerLinkRow{
  display:flex; gap:12px; align-items:center;
  padding:12px; border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:inherit; text-decoration:none;
}
.peerFileIcon{ width:38px; height:38px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.06); flex:0 0 auto; }
.peerFileMain{ min-width:0; }
.peerFileName, .peerLinkUrl{ font-weight:700; word-break:break-word; }
.peerFileMeta, .peerLinkMeta{ font-size:12px; color:var(--muted2); margin-top:3px; }
.statebox.compact{ padding:18px 14px; }


/* ===== 2.11.0 workspace overhaul ===== */
.sidebarSection{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 14px 10px 14px;
  color:var(--muted2);
  font-size:12px;
  letter-spacing:.2px;
}
.sidebarLabel{
  text-transform:uppercase;
  font-weight:800;
  color:rgba(255,255,255,.72);
}
.sidebarMeta{color:var(--muted2)}

.item{
  position:relative;
  padding:12px 12px;
  border-radius:16px;
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  cursor:pointer;
  border:1px solid transparent;
}
.item:hover{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.05);
}
.item.active{
  background:linear-gradient(180deg, rgba(79,140,255,.18), rgba(79,140,255,.10));
  border:1px solid rgba(79,140,255,.30);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.03);
}
.itemMain{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.itemTop{
  display:flex;
  gap:8px;
  align-items:center;
  min-width:0;
}
.name{
  font-weight:800;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.itemTime{
  margin-left:auto;
  font-size:11px;
  color:var(--muted2);
  flex:0 0 auto;
}
.sub{
  font-size:12px;
  color:var(--muted2);
  display:flex;
  gap:8px;
  align-items:center;
}
.preview{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.itemAside{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:8px;
}
.unread{
  min-width:22px;
  height:22px;
  padding:0 7px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(79,140,255,.22);
  border:1px solid rgba(79,140,255,.42);
  color:#dce8ff;
  font-size:11px;
  font-weight:800;
}
.mutedMark{
  font-size:11px;
  color:var(--muted2);
}

.main{
  background:
    radial-gradient(1000px 600px at 20% 0%, rgba(79,140,255,.07), transparent 60%),
    linear-gradient(180deg, rgba(8,12,24,.98) 0%, rgba(8,12,24,.92) 100%);
}

.header{
  height:72px;
  padding:12px 18px;
  background:rgba(8,12,24,.82);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.peerMeta{min-width:0; display:flex; flex-direction:column; gap:4px}
.peerSubline{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}
.peerSubline .hint,
.presenceText{
  font-size:12px;
  color:var(--muted2);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.presenceText{color:rgba(187,255,220,.88)}
.presenceDot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#33d17a;
  display:inline-block;
  box-shadow:0 0 0 4px rgba(51,209,122,.10);
  margin-right:6px;
}

.messages{
  padding:20px 18px 14px 18px;
  gap:12px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.01), rgba(255,255,255,0)),
    radial-gradient(800px 420px at 70% 100%, rgba(79,140,255,.04), transparent 70%);
}

.statebox{
  align-self:end;
  margin-bottom:2px;
  width:min(540px, 100%);
  margin:auto;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.03);
  border-radius:20px;
  padding:22px 24px;
  box-shadow:var(--shadow);
}
.statebox .title{
  font-size:20px;
  font-weight:800;
  margin-bottom:6px;
}

.composer{
  position:relative;
  padding:14px 18px 18px 18px;
  background:linear-gradient(180deg, rgba(8,12,24,.30), rgba(8,12,24,.95));
  border-top:1px solid rgba(255,255,255,.06);
}
.composerRow{
  display:grid;
  grid-template-columns:auto auto minmax(0,1fr) auto;
  gap:10px;
  align-items:end;
}
#text{
  min-height:48px;
  max-height:180px;
  padding:13px 14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:var(--text);
  outline:none;
  resize:none;
}
#send{
  min-width:112px;
  height:48px;
  border-radius:14px;
}

.empty{
  padding:24px;
  align-items:center;
  justify-content:center;
}
.emptyHero{
  width:min(940px, 100%);
  border:1px solid rgba(255,255,255,.06);
  background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));
  border-radius:28px;
  padding:28px;
  box-shadow:var(--shadow);
}
.emptyBadge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(79,140,255,.30);
  background:rgba(79,140,255,.10);
  color:#dce8ff;
  font-size:12px;
  font-weight:800;
  margin-bottom:14px;
}
.emptyHero h2{
  margin:0 0 10px 0;
  font-size:32px;
  line-height:1.05;
}
.emptyHero p{
  margin:0 0 20px 0;
  color:var(--muted);
  font-size:15px;
  max-width:760px;
}
.emptyGrid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:14px;
}
.emptyMiniCard{
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.025);
  border-radius:20px;
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:10px;
}
.emptyMiniTitle{
  font-size:18px;
  font-weight:800;
}
.emptyMiniText{
  color:var(--muted);
  font-size:14px;
  min-height:58px;
}
.full{width:100%}

@media (max-width: 1000px){
  .emptyGrid{grid-template-columns:1fr}
}
@media (max-width: 720px){
  .sidebar{
    width:100%;
    max-width:none;
  }
  .mobile-chat .sidebar{display:none}
  .mobile-chat .main{display:flex}
  .header{height:auto; min-height:70px}
  .messages{padding:14px 12px}
  .composer{padding:12px}
  .empty{padding:14px}
  .emptyHero{padding:20px}
  .emptyHero h2{font-size:26px}
}


/* ===== 2.12.0 MVP chat workspace rewrite ===== */
.item{width:100%; border:1px solid transparent; background:transparent; color:var(--text)}
.itemMain{min-width:0; display:flex; flex-direction:column; gap:4px; text-align:left}
.itemTop{display:flex; gap:8px; align-items:center}
.itemTime{margin-left:auto; font-size:11px; color:var(--muted2)}
.preview{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.itemAside{display:flex; flex-direction:column; align-items:flex-end; gap:8px}
.unread{
  min-width:22px; height:22px; padding:0 7px; border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center;
  background:rgba(79,140,255,.22); border:1px solid rgba(79,140,255,.38);
  font-size:11px; font-weight:800;
}
.mutedMark{font-size:11px; color:var(--muted2)}
.daysep{
  align-self:center;
  font-size:12px;
  color:var(--muted2);
  padding:6px 10px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.03);
  border-radius:999px;
  margin:8px 0 2px;
}
.fileCard{
  display:flex;
  flex-direction:column;
  gap:8px;
}
.fileCard audio{width:min(320px, 100%)}
.fileMeta{font-size:12px; color:var(--muted2)}
.statebox{
  align-self:center;
  width:min(560px, 100%);
  margin:auto;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.03);
  border-radius:20px;
  padding:22px 24px;
  box-shadow:var(--shadow);
}
.statebox .title{font-size:20px; font-weight:800; margin-bottom:6px}
.peerSubline{display:flex; gap:10px; align-items:center}
.presenceText{font-size:12px; color:var(--muted2)}
.composerRow{display:grid; grid-template-columns:auto auto minmax(0,1fr) auto; gap:10px; align-items:end}
.icon-btn{min-width:44px; height:44px}
#send{min-width:110px}
@media (max-width:720px){
  .mobile-chat .sidebar{display:none}
  .mobile-chat .main{display:flex}
}

/* DiValis 2.34 — personal music home and one adaptive player. */
.musicHubShell{grid-template-rows:auto auto minmax(0,1fr) auto}
.musicHubContent{padding-top:8px}
.musicHubContent.musicBackSwiping,.musicHubContent.musicBackSettling{transform:translateX(var(--music-back-x,0));opacity:var(--music-back-opacity,1);will-change:transform,opacity}.musicHubContent.musicBackSwiping{transition:none}.musicHubContent.musicBackSettling{transition:transform .2s cubic-bezier(.2,.8,.2,1),opacity .18s ease}
.musicForYou{padding:0 2px 22px}.musicForYou>header{padding:4px 3px 15px;display:flex;align-items:end;justify-content:space-between;gap:16px}.musicForYou>header>span{display:grid;gap:4px}.musicForYou>header small,.musicCollectionPage header small{color:#b07087;font-size:9px;font-weight:850;letter-spacing:.13em;text-transform:uppercase}.musicForYou>header strong{font:700 30px/1 Georgia,"Times New Roman",serif;color:#613747}.musicForYou>header>i{max-width:280px;color:#ad8291;font-size:9.5px;font-style:normal;text-align:right}
.musicContinue{width:100%;min-height:72px;margin:0 0 13px;padding:8px 12px 8px 8px;border:1px solid rgba(143,76,99,.12);border-radius:22px;display:grid;grid-template-columns:54px minmax(0,1fr) 42px;align-items:center;gap:11px;background:rgba(255,255,255,.62);color:#633b4b;text-align:left;box-shadow:0 10px 25px rgba(110,52,73,.07)}.musicContinueArt{position:relative;width:54px;height:54px;border-radius:16px;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#efd4dc,#f9ede6);color:#a74e6e}.musicContinueArt img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.musicContinue>span:nth-child(2){min-width:0;display:grid;gap:2px}.musicContinue small{color:#b77c91;font-size:8.5px;font-weight:780;text-transform:uppercase;letter-spacing:.07em}.musicContinue strong,.musicContinue i{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicContinue strong{font-size:13px}.musicContinue i{color:#a27a88;font-size:9.5px;font-style:normal}.musicContinue>b{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#c7537a;color:#fff}.musicContinue>b .uiIcon{width:17px;height:17px}
.musicCollectionCard{position:relative;min-width:0;min-height:180px;padding:17px;border:0;border-radius:28px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) 132px;align-items:center;gap:18px;color:#fff;text-align:left;box-shadow:0 18px 38px rgba(91,42,61,.14);isolation:isolate;transition:transform .18s ease,box-shadow .18s ease}.musicCollectionCard::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(145deg,#a74568,#d86f90 58%,#efaa91)}.musicCollectionCard::after{content:"";position:absolute;z-index:-1;width:210px;height:210px;right:-95px;top:-105px;border:35px solid rgba(255,255,255,.09);border-radius:50%}.musicCollectionCard.wine::before{background:linear-gradient(145deg,#4d2436,#873b59 62%,#c75b7e)}.musicCollectionCard.gold::before{background:linear-gradient(145deg,#9b5948,#d78c65 58%,#f2c18b)}.musicCollectionCard.blue::before{background:linear-gradient(145deg,#344d67,#657f9b 58%,#9eb4bf)}.musicCollectionCard:active{transform:scale(.985);box-shadow:0 10px 24px rgba(91,42,61,.16)}.musicCollectionCard.featured{min-height:216px;margin-bottom:16px;padding:23px 23px 23px 25px;grid-template-columns:minmax(0,1fr) 166px}.musicCollectionCopy{min-width:0;display:grid;align-content:center;gap:7px}.musicCollectionCopy small{color:rgba(255,255,255,.7);font-size:8.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.musicCollectionCopy strong{font:700 24px/1.05 Georgia,"Times New Roman",serif}.musicCollectionCopy i{max-width:330px;color:rgba(255,255,255,.74);font-size:10px;line-height:1.35;font-style:normal}.musicCollectionCopy b{width:max-content;margin-top:8px;padding:9px 13px;border-radius:999px;display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.18);font-size:10px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.musicCollectionCopy b .uiIcon{width:13px;height:13px}.musicCollectionMosaic{position:relative;width:132px;height:132px;border-radius:27px;overflow:hidden;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr);background:rgba(255,255,255,.14);box-shadow:0 15px 32px rgba(48,18,30,.2);transform:rotate(3deg)}.featured .musicCollectionMosaic{width:166px;height:166px;border-radius:34px}.musicCollectionMosaic img{width:100%;height:100%;object-fit:cover}.musicCollectionMosaic.count-1 img{grid-column:1/-1;grid-row:1/-1}.musicCollectionMosaic.count-2 img{grid-row:1/-1}.musicCollectionMosaic>.uiIcon{grid-column:1/-1;grid-row:1/-1;align-self:center;justify-self:center;width:42px;height:42px;color:rgba(255,255,255,.8)}.musicCollectionGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.musicCollectionGrid .musicCollectionCard{grid-template-columns:minmax(0,1fr) 94px;min-height:150px}.musicCollectionGrid .musicCollectionMosaic{width:94px;height:94px;border-radius:22px}.musicCollectionGrid .musicCollectionCopy strong{font-size:19px}
.musicCollectionPage{padding:0 1px 24px}.musicCollectionBack{height:38px;margin:0 0 10px;padding:0 12px 0 8px;border:1px solid rgba(143,76,99,.1);border-radius:999px;display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.5);color:#8b5368;font:inherit;font-size:10px;font-weight:780}.musicCollectionBack .uiIcon{width:17px;height:17px}.musicCollectionPage>header{min-height:148px;padding:15px 18px;border-radius:27px;display:flex;align-items:center;gap:18px;background:linear-gradient(135deg,rgba(255,255,255,.7),rgba(250,226,232,.75));box-shadow:0 14px 34px rgba(105,48,70,.08)}.musicCollectionPage>header .musicCollectionMosaic{width:116px;height:116px;flex:0 0 116px;border-radius:25px;transform:rotate(-2deg);background:linear-gradient(145deg,#b84e72,#e68aa4)}.musicCollectionPage>header>span:last-child{min-width:0;display:grid;gap:5px}.musicCollectionPage>header strong{font:700 27px/1.05 Georgia,"Times New Roman",serif;color:#603747}.musicCollectionPage>header i{color:#a37484;font-size:10px;font-style:normal}.musicCollectionPageActions{min-height:58px;padding:9px 5px 8px;display:flex;align-items:center;justify-content:space-between}.musicCollectionPageActions button{height:40px;padding:0 16px;border:0;border-radius:999px;display:flex;align-items:center;gap:8px;background:linear-gradient(135deg,#d5688b,#a94369);color:#fff;box-shadow:0 8px 20px rgba(167,61,98,.2)}.musicCollectionPageActions button .uiIcon{width:15px;height:15px}.musicCollectionPageActions span{color:#aa7d8c;font-size:9.5px}
.musicTrackTail{display:flex;align-items:center;gap:8px}.musicTrackTail>i{color:#c84e77;font-size:13px;font-style:normal}.musicTrackDuration{min-width:34px;text-align:right}
.musicPlayer{min-height:76px!important;padding-top:5px!important;padding-bottom:calc(5px + env(safe-area-inset-bottom))!important;grid-template-columns:minmax(0,1fr) minmax(120px,.8fr) auto!important;gap:8px 13px!important}.musicPlayerArtwork{width:44px!important;height:44px!important;flex-basis:44px!important;border-radius:13px!important}.musicPlayerTimeline{gap:0}.musicPlayerTimes{display:none}.musicPlayerTimeline input{height:24px!important;margin:-5px 0!important}.musicPlayerControls{gap:4px}.musicControl{width:32px!important;height:32px!important}.musicControl.primary{width:40px!important;height:40px!important}
.musicNowPlaying{position:absolute;z-index:35;inset:0;overflow:hidden;display:grid;grid-template-rows:auto minmax(0,1fr);background:linear-gradient(160deg,#fff7ef 0%,#f7e2df 53%,#ecd1d9 100%);opacity:1;transform:none;transition:opacity .22s ease,transform .28s cubic-bezier(.2,.8,.2,1)}.musicNowPlaying.hidden{display:none!important}.musicNowBackdrop{position:absolute;inset:-20%;background:radial-gradient(circle at 50% 28%,rgba(207,93,130,.22),transparent 28%),radial-gradient(circle at 4% 96%,rgba(244,194,136,.3),transparent 33%);pointer-events:none}.musicNowHeader{position:relative;z-index:2;min-height:72px;padding:calc(10px + env(safe-area-inset-top)) 18px 8px;display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:10px}.musicNowHeader>span{min-width:0;display:grid;gap:2px;text-align:center}.musicNowHeader small{color:#ad778a;font-size:8px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}.musicNowHeader strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#67404f;font-size:11px}.musicNowCircle{width:42px;height:42px;padding:0;border:1px solid rgba(126,70,89,.11);border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.5);color:#824b60;box-shadow:0 7px 19px rgba(94,42,61,.08)}.musicNowCircle .uiIcon{width:18px;height:18px}.musicNowBody{position:relative;z-index:1;width:min(100%,590px);height:100%;min-height:0;margin:0 auto;padding:14px 34px calc(24px + env(safe-area-inset-bottom));display:grid;grid-template-rows:minmax(180px,1fr) auto auto auto auto;align-items:center;gap:14px}.musicNowArtwork{position:relative;align-self:center;justify-self:center;width:min(48vh,76vw,390px);aspect-ratio:1;border-radius:12%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#d37996,#74384f);color:rgba(255,255,255,.8);box-shadow:0 32px 65px rgba(74,30,47,.25),0 0 0 1px rgba(255,255,255,.55)}.musicNowArtwork img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.musicNowArtwork .uiIcon{width:62px;height:62px}.musicNowIdentity{min-width:0;display:grid;gap:4px;text-align:center}.musicNowIdentity strong,.musicNowIdentity span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicNowIdentity strong{font:700 25px/1.1 Georgia,"Times New Roman",serif;color:#56313f}.musicNowIdentity span{color:#9a6d7d;font-size:11px}.musicNowTimeline{display:grid;gap:0}.musicNowTimeline>div{display:flex;justify-content:space-between;color:#9d7482;font-size:9px;font-variant-numeric:tabular-nums}.musicNowTimeline input{--music-progress:0%;width:100%;height:38px;margin:-6px 0;padding:0;appearance:none;-webkit-appearance:none;background:transparent;touch-action:none}.musicNowTimeline input::-webkit-slider-runnable-track{height:5px;border-radius:999px;background:linear-gradient(90deg,#b8436b 0 var(--music-progress),rgba(113,62,80,.18) var(--music-progress) 100%)}.musicNowTimeline input::-webkit-slider-thumb{width:20px;height:20px;margin-top:-7.5px;border:4px solid #fff;border-radius:50%;appearance:none;-webkit-appearance:none;background:#b8436b;box-shadow:0 3px 12px rgba(89,34,54,.3)}.musicNowControls{display:flex;align-items:center;justify-content:center;gap:30px}.musicNowControl{width:50px;height:50px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.55);color:#754357}.musicNowControl.primary{position:relative;width:72px;height:72px;background:linear-gradient(145deg,#d9688c,#a43e66);color:#fff;box-shadow:0 14px 30px rgba(151,51,87,.27)}.musicNowControl .uiIcon{width:23px;height:23px}.musicNowControl.primary .uiIcon{width:30px;height:30px}.musicNowControl:active{transform:scale(.92)}.musicNowActions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.musicNowActions button{min-height:52px;padding:7px 8px;border:1px solid rgba(127,69,89,.1);border-radius:17px;display:flex;align-items:center;justify-content:center;gap:7px;background:rgba(255,255,255,.46);color:#885368;font:inherit}.musicNowActions button>span{font-size:21px;line-height:1}.musicNowActions button .uiIcon{width:17px;height:17px}.musicNowActions button strong{font-size:9px}.musicNowActions button.active{border-color:transparent;background:#b8446c;color:#fff;box-shadow:0 8px 20px rgba(154,51,87,.2)}.musicNowActions #musicDislike.active{background:#6d5963}.musicNowActions button:disabled{opacity:.58}
.musicNowPlaying.musicNowDragging,.musicNowPlaying.musicNowSettling{transform:translateY(var(--music-now-y,0)) scale(var(--music-now-scale,1));opacity:var(--music-now-opacity,1);transform-origin:50% 100%;will-change:transform,opacity}.musicNowPlaying.musicNowDragging{transition:none}.musicNowPlaying.musicNowSettling{transition:transform .22s cubic-bezier(.2,.8,.2,1),opacity .2s ease}
.musicQueueSheet{position:absolute;z-index:5;left:14px;right:14px;bottom:14px;max-height:min(65%,560px);padding:8px 9px 14px;border:1px solid rgba(255,255,255,.66);border-radius:28px;display:grid;grid-template-rows:auto auto minmax(0,1fr);background:rgba(255,249,244,.94);box-shadow:0 28px 75px rgba(69,26,43,.3);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px)}.musicQueueSheet.hidden{display:none!important}.musicQueueHandle{width:38px;height:4px;margin:0 auto 5px;border-radius:999px;background:#d6b7c2}.musicQueueSheet>header{min-height:50px;padding:2px 5px 8px;display:flex;align-items:center;justify-content:space-between}.musicQueueSheet>header>span{display:grid;gap:2px}.musicQueueSheet header small{color:#b37b8f;font-size:8px;text-transform:uppercase;letter-spacing:.12em}.musicQueueSheet header strong{color:#603847;font:700 18px/1 Georgia,serif}.musicQueueList{min-height:0;overflow-y:auto;display:grid;gap:5px}.musicQueueItem{width:100%;min-height:56px;padding:5px 8px 5px 5px;border:0;border-radius:16px;display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;gap:10px;background:transparent;color:#653d4c;text-align:left}.musicQueueItem.active{background:#f2dce3}.musicQueueArt{position:relative;width:46px;height:46px;border-radius:13px;overflow:hidden;display:grid;place-items:center;background:#ecd7de;color:#9f4d6b}.musicQueueArt img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.musicQueueItem>span{min-width:0;display:grid;gap:3px}.musicQueueItem strong,.musicQueueItem small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicQueueItem strong{font-size:11px}.musicQueueItem small,.musicQueueItem time{color:#a47a89;font-size:8.5px}
.musicQueueHistoryLabel{margin:10px 8px 2px;padding-top:12px;border-top:1px solid #ead3d9;color:#a36f83;font-size:10px;font-weight:700;letter-spacing:.02em}.musicQueueHistoryLabel~.musicQueueItem{opacity:.72}
@media(max-width:650px){.musicForYou>header strong{font-size:27px}.musicForYou>header>i{max-width:155px;font-size:8px}.musicCollectionCard.featured{min-height:190px;padding:19px;grid-template-columns:minmax(0,1fr) 120px}.featured .musicCollectionMosaic{width:120px;height:120px;border-radius:27px}.musicCollectionGrid{grid-template-columns:1fr}.musicCollectionGrid .musicCollectionCard{min-height:132px;grid-template-columns:minmax(0,1fr) 88px}.musicCollectionGrid .musicCollectionMosaic{width:88px;height:88px}.musicCollectionCopy strong{font-size:21px}.musicCollectionPage>header{min-height:126px;padding:12px}.musicCollectionPage>header .musicCollectionMosaic{width:94px;height:94px;flex-basis:94px}.musicCollectionPage>header strong{font-size:23px}.musicPlayer{min-height:68px!important;grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:"track controls" "timeline timeline"!important;padding-bottom:4px!important}.musicPlayerTimeline input{height:18px!important}.musicPlayerControls #musicPrevious{display:none}.musicNowHeader{min-height:66px;padding-left:12px;padding-right:12px}.musicNowBody{padding:6px 22px calc(12px + env(safe-area-inset-bottom));gap:10px;grid-template-rows:minmax(160px,1fr) auto auto auto auto}.musicNowArtwork{width:min(42vh,78vw,340px)}.musicNowIdentity strong{font-size:22px}.musicNowControls{gap:24px}.musicNowActions button strong{display:none}.musicNowActions button{min-height:45px}.musicNowActions button>span{font-size:20px}.musicQueueSheet{bottom:8px;left:8px;right:8px;max-height:72%;border-radius:25px}.musicTrackTail{gap:5px}}
@media(max-height:650px) and (orientation:landscape){.musicNowBody{width:min(100%,760px);grid-template-columns:minmax(190px,.8fr) minmax(280px,1fr);grid-template-rows:auto auto auto auto;padding:6px 28px 14px;column-gap:28px}.musicNowArtwork{grid-row:1/-1;width:min(68vh,310px)}.musicNowIdentity,.musicNowTimeline,.musicNowControls,.musicNowActions{grid-column:2}.musicNowActions{width:100%}}

/* DiValis 2.27.3 — distraction-free full-screen photo viewer */
.photoViewer{
  background:#0d0a0c!important;
  padding:0!important;
}
.photoViewer .modal-header,
.photoViewer .modal-actions,
.videoViewer .modal-header,
.videoViewer .modal-actions{display:none!important;}
.photoViewer .mediaViewerBody{
  position:relative;
  display:block!important;
  width:100%;height:100%;padding:0!important;
  background:#0d0a0c;
}
.photoViewer .viewerImageStage{
  position:absolute;inset:0;width:100%;height:100%;
  display:flex;align-items:center;justify-content:center;
  background:#0d0a0c;border-radius:0;
  touch-action:none;overflow:hidden;
}
.photoViewer .viewerImage{
  width:auto;height:auto;max-width:100%!important;max-height:100%!important;
  object-fit:contain;border-radius:0!important;box-shadow:none!important;
  -webkit-user-drag:none!important;
  -webkit-user-select:none!important;user-select:none!important;
  -webkit-touch-callout:default!important;
  transition:transform .16s cubic-bezier(.2,.75,.25,1);
}
.photoViewer .viewerImageStage.interacting .viewerImage,
.photoViewer .viewerImageStage.zoomed .viewerImage,
.photoViewer .viewerImageStage.dismissing .viewerImage{transition:none;}
.photoViewer .viewerImageStage.viewerSnapBack .viewerImage{transition:transform .18s cubic-bezier(.22,.8,.32,1);}
.photo-viewer-open,
html.photo-viewer-open,
body.photo-viewer-open{background:#000!important;}
body.photo-viewer-open .modal-overlay.photoViewerOverlay{
  position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;
  max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;
  align-items:stretch!important;justify-content:stretch!important;background:#000!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
body.photo-viewer-open :is(.photoViewer,.videoViewer).fullScreenMediaViewer{
  position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;
  max-width:none!important;max-height:none!important;margin:0!important;padding:0!important;
  display:block!important;background:#000!important;border:0!important;border-radius:0!important;box-shadow:none!important;
}
body.photo-viewer-open .photoViewer .mediaViewerBody{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;
  display:flex!important;align-items:center!important;justify-content:center!important;background:#000!important;
}
body.photo-viewer-open .photoViewer .viewerImageStage{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;
  display:flex!important;align-items:center!important;justify-content:center!important;background:#000!important;
}
body.photo-viewer-open .photoViewer .viewerImage{
  flex:0 0 auto!important;margin:auto!important;max-width:100%!important;max-height:100%!important;
  width:auto!important;height:auto!important;object-fit:contain!important;border-radius:0!important;box-shadow:none!important;
}
body.photo-viewer-open .videoViewer .mediaViewerBody,
body.photo-viewer-open .videoViewer .videoViewerStage{
  position:absolute!important;inset:0!important;width:100%!important;height:100%!important;
  min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;
  display:flex!important;align-items:center!important;justify-content:center!important;background:#000!important;
}
body.photo-viewer-open .videoViewer .viewerVideo{
  display:block!important;width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;
  object-fit:contain!important;border:0!important;border-radius:0!important;background:#000!important;
}
.videoViewerControls{z-index:12;}
.viewerFloatingControls{
  position:absolute;z-index:8;
  top:calc(env(safe-area-inset-top) + 12px);right:12px;
  display:flex;align-items:center;gap:8px;
  opacity:1;transform:translateY(0);
  transition:opacity .2s ease,transform .2s ease;
}
.viewerAction{
  appearance:none;width:38px;height:38px;padding:0;
  display:grid;place-items:center;border-radius:50%;
  border:1px solid rgba(255,255,255,.2);color:#fff;
  background:rgba(37,27,33,.58);
  box-shadow:0 5px 22px rgba(0,0,0,.22);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  cursor:pointer;-webkit-tap-highlight-color:transparent;
}
.viewerAction:active{transform:scale(.92);background:rgba(174,103,127,.7);}
.viewerAction .uiIcon{width:19px;height:19px;stroke-width:1.8;}
.photoViewer.viewerUiHidden .viewerFloatingControls{
  opacity:0;transform:translateY(-8px);pointer-events:none;
}
.viewerSaveHint{
  position:absolute;z-index:9;left:50%;bottom:calc(env(safe-area-inset-bottom) + 24px);
  max-width:min(86vw,360px);padding:10px 14px;border-radius:999px;
  color:#fff;background:rgba(37,27,33,.72);border:1px solid rgba(255,255,255,.18);
  box-shadow:0 8px 28px rgba(0,0,0,.25);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  font-size:13px;font-weight:700;text-align:center;
  opacity:0;transform:translate(-50%,10px);pointer-events:none;
  transition:opacity .2s ease,transform .2s ease;
}
.viewerSaveHint.show{opacity:1;transform:translate(-50%,0);}


/* ===== 2.12.2 dialog direction + receipts polish ===== */
.bubble{
  position:relative;
  isolation:isolate;
  overflow:visible;
  max-width:min(560px, 90%);
  padding:10px 12px;
  border-radius:18px;
  border:1px solid var(--border);
  box-shadow: var(--shadow);
  transform:translateY(0);
  transition:transform .18s ease, box-shadow .22s ease, border-color .22s ease;
}
.bubble::before{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  bottom:var(--bubble-glow-lift);
  height:var(--bubble-glow-height);
  border-radius:999px;
  filter:blur(var(--bubble-glow-blur));
  opacity:var(--bubble-glow-opacity);
  pointer-events:none;
  z-index:-1;
  transform:translateZ(0);
}
.bubble:hover{
  transform:translateY(var(--bubble-hover-lift));
}
.bubble.incoming{
  align-self:flex-start;
  background:var(--bubble-in-bg);
  border-color:var(--bubble-in-border);
  color:var(--bubble-in-text);
}
.bubble.incoming::before{
  background:radial-gradient(circle at 50% 50%, var(--bubble-in-glow-core) 0%, var(--bubble-in-glow-soft) 42%, transparent 78%);
}
.bubble.outgoing{
  align-self:flex-end;
  background:linear-gradient(180deg, var(--bubble-out-bg-start), var(--bubble-out-bg-end));
  border-color:var(--bubble-out-border);
  color:var(--bubble-out-text);
}
.bubble.outgoing::before{
  background:radial-gradient(circle at 50% 50%, var(--bubble-out-glow-core) 0%, var(--bubble-out-glow-soft) 44%, transparent 80%);
}
.bubble .time{
  margin-top:6px;
  font-size:11px;
}
.bubble .time-in{
  color:var(--bubble-in-time);
  text-align:left;
}
.bubble .time-out{
  color:var(--bubble-out-time);
  text-align:right;
}
.bubble.groupMid::before,
.bubble.groupTop::before{
  opacity:calc(var(--bubble-glow-opacity) * .58);
}
.bubble.fileBubble::before,
.bubble.voiceBubble::before{
  left:12px;
  right:12px;
  height:24px;
  opacity:calc(var(--bubble-glow-opacity) * .92);
}
@media (prefers-reduced-motion: reduce){
  .bubble{transition:none}
  .bubble:hover{transform:none}
}


.app{
  min-height:100dvh;
  height:100dvh;
}
.sidebar, .main{
  min-height:0;
}
.topbar, .header{
  padding-top:max(10px, env(safe-area-inset-top));
}
.messages{
  scroll-behavior:smooth;
}
.composer{
  padding-bottom:max(10px, env(safe-area-inset-bottom));
}
#text, .composer textarea, .search input, .input{
  font-size:16px;
}

@media (max-width: 900px){
  .sidebar{width:332px}
}

@media (max-width: 720px){
  body{
    background:linear-gradient(180deg, #0b1120 0%, #08101f 100%) fixed;
  }
  .app{
    min-height:100dvh;
    height:100dvh;
  }
  .sidebar,
  .main{
    width:100%;
    max-width:none;
    height:100dvh;
  }
  .sidebar{
    border-right:none;
  }
  .topbar{
    position:sticky;
    top:0;
    z-index:30;
    background:rgba(11,15,26,.94);
    backdrop-filter:blur(14px);
    padding:calc(env(safe-area-inset-top) + 10px) 12px 10px;
  }
  .brand{
    min-width:0;
    gap:8px;
  }
  .brand > span:first-child,
  .h1{
    font-size:22px;
    font-weight:800;
    line-height:1;
  }
  .pill, #mePill{
    max-width:44vw;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .search{
    position:sticky;
    top:calc(env(safe-area-inset-top) + 66px);
    z-index:25;
    background:rgba(11,15,26,.94);
    backdrop-filter:blur(14px);
    padding:0 12px 10px;
  }
  .search input,
  .input,
  .composer textarea,
  #text{
    min-height:48px;
    border-radius:16px;
    font-size:16px;
  }
  .sidebarSection,
  .actions{
    padding-left:12px;
    padding-right:12px;
  }
  .actions{
    position:sticky;
    top:calc(env(safe-area-inset-top) + 126px);
    z-index:24;
    background:rgba(11,15,26,.94);
    backdrop-filter:blur(14px);
    margin:0;
    padding-bottom:12px;
  }
  .actions .btn{
    flex:1;
    min-height:48px;
    border-radius:16px;
  }
  .list{
    padding:8px 8px calc(18px + env(safe-area-inset-bottom));
  }
  .item,
  .chatlist-item{
    min-height:76px;
    padding:14px 12px;
    border-radius:16px;
    margin-bottom:8px;
    background:rgba(255,255,255,.03);
  }
  .avatar, .avatarCircle{
    width:44px;
    height:44px;
  }
  .name, .title{
    font-size:17px;
  }
  .sub, .hint, .peerSubtitle, .presenceText, .sidebarMeta, .chatlist-meta{
    font-size:13px;
  }
  .header{
    position:sticky;
    top:0;
    z-index:35;
    height:auto;
    min-height:64px;
    padding:calc(env(safe-area-inset-top) + 10px) 12px 10px;
    background:rgba(11,15,26,.96);
    backdrop-filter:blur(14px);
  }
  .header .right{
    gap:8px;
  }
  .lock{
    max-width:44vw;
    overflow:hidden;
    white-space:nowrap;
    text-overflow:ellipsis;
  }
  #btnBack{
    min-width:44px;
    height:44px;
    padding:0 12px;
    border-radius:14px;
  }
  .messages{
    padding:10px 10px 12px;
    gap:8px;
  }
  .bubble,
  .msg{
    max-width:88%;
    border-radius:18px;
    padding:12px 14px;
    box-shadow:none;
  }
  .bubble .text,
  .msg{
    font-size:16px;
    line-height:1.4;
  }
  .bubble .time,
  .msgmeta,
  .time{
    font-size:12px;
  }
  .composer{
    position:sticky;
    bottom:0;
    z-index:34;
    gap:8px;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom));
    background:rgba(11,15,26,.97);
    backdrop-filter:blur(14px);
  }
  .composerRow{
    gap:8px;
    align-items:flex-end;
  }
  .composer .btn,
  .icon-btn,
  .attach,
  .mic,
  #send,
  #sendBtn{
    min-width:46px;
    min-height:46px;
    border-radius:14px;
  }
  #send,
  #sendBtn{
    padding:0 16px;
  }
  .empty{
    padding:16px 12px calc(20px + env(safe-area-inset-bottom));
    align-items:flex-start;
  }
  .emptyCard,
  .emptyHero{
    width:100%;
    border-radius:20px;
    padding:18px 16px;
  }
  .emptyGrid{
    grid-template-columns:1fr;
  }
  .emptyMiniCard{
    border-radius:18px;
  }
  .modal-overlay{
    align-items:flex-end;
    padding:0;
  }
  .modal{
    max-width:none;
    width:100%;
    border-radius:20px 20px 0 0;
    padding-bottom:max(12px, env(safe-area-inset-bottom));
  }
  .modal-actions{
    flex-wrap:wrap;
  }
  .modal-actions .btn,
  .modal-actions .btn-secondary{
    flex:1;
    min-height:46px;
  }
  .drawer{
    width:100%;
    right:0;
    border-left:none;
  }
  .fab{
    right:12px;
    bottom:88px;
  }
  .newmsgs{
    bottom:92px;
    max-width:calc(100% - 24px);
  }
}


.title-link{
  appearance:none;
  background:transparent;
  border:none;
  color:inherit;
  padding:0;
  margin:0;
  text-align:left;
  cursor:pointer;
}
.title-link:hover{opacity:.92}
.title-link:disabled{cursor:default; opacity:1}

.peerSubline{
  gap:0;
}
.lock{
  min-width:36px;
  justify-content:center;
  padding:6px 8px;
  gap:0;
}



/* warm sand theme overrides */
body[data-theme="warm-sand"]{color:var(--text);}
body[data-theme="warm-sand"] .appShell,body[data-theme="warm-sand"] .sidebar,body[data-theme="warm-sand"] .chatHeader,body[data-theme="warm-sand"] .composer,body[data-theme="warm-sand"] .modal-card,body[data-theme="warm-sand"] .search,body[data-theme="warm-sand"] .item,body[data-theme="warm-sand"] .btn,body[data-theme="warm-sand"] .input,body[data-theme="warm-sand"] textarea,body[data-theme="warm-sand"] input{backdrop-filter:none;}
body[data-theme="warm-sand"] .sidebar,body[data-theme="warm-sand"] .chatMain,body[data-theme="warm-sand"] .composer,body[data-theme="warm-sand"] .chatHeader,body[data-theme="warm-sand"] .item,body[data-theme="warm-sand"] .search,body[data-theme="warm-sand"] .btn,body[data-theme="warm-sand"] .bubble,body[data-theme="warm-sand"] .modal-card,body[data-theme="warm-sand"] .emptyCard,body[data-theme="warm-sand"] .statebox,body[data-theme="warm-sand"] .peerFileRow,body[data-theme="warm-sand"] .peerLinkRow,body[data-theme="warm-sand"] .peerMediaItem{background:rgba(255,255,255,.52);}
body[data-theme="warm-sand"] .item.active,body[data-theme="warm-sand"] .btn.primary,body[data-theme="warm-sand"] .fab,body[data-theme="warm-sand"] .uploadBar > div{background:#a58d6d !important;color:#fff !important;}
body[data-theme="warm-sand"] .chatHeader{background:rgba(247,242,234,.88) !important;}
.peer .hint:empty{display:none;}
.title-link{color:var(--text);cursor:pointer;}
.title-link:hover{text-decoration:underline;}
.peerProfileCard.advanced,.profileHero,.profileGrid,.peerCardSection{background:transparent;}


.hiddenLabel{display:none}
.topbar{position:relative;min-height:64px}
.topbarActions{margin-left:auto;display:flex;gap:8px;align-items:center;min-width:0}
.iconOnly{padding:6px 8px}
.profileBtn.compact{min-width:44px}
.profileBtn.compact span:last-child{display:none}
.menuToggle{min-width:42px;height:42px;font-size:22px;line-height:1;padding:0 10px}
.topbarMenu{
  position:absolute;
  right:14px;
  top:58px;
  z-index:40;
  min-width:180px;
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:8px;
  border:1px solid var(--border);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(247,242,234,.98), rgba(239,230,216,.98));
  box-shadow:var(--shadow);
}
.topbarMenu.hidden{display:none}
.menuItem{
  width:100%;
  text-align:left;
  border:1px solid transparent;
  background:transparent;
  color:var(--text);
  padding:10px 12px;
  border-radius:10px;
  cursor:pointer;
  font:inherit;
  font-weight:600;
}
.menuItem:hover{background:rgba(255,255,255,.3);border-color:var(--border)}
.menuItem.danger{color:#9f4b4b}
#mePill{display:none !important}
.sidebar{width:328px}
@media (max-width: 900px){.sidebar{width:300px}}


/* 2.17.0 UI stability step 1 */
.app{display:grid;grid-template-columns:minmax(300px,340px) minmax(0,1fr);width:100%;min-width:0;}
.main{min-width:0;width:100%;}
.messages,.composer,.header,.empty{min-width:0;}
.messages{width:100%;padding-left:18px;padding-right:18px;}
.bubble{max-width:min(720px,72%);}
.emptyHero{width:min(1040px,100%);}
@media (max-width: 860px){.app{grid-template-columns:320px minmax(0,1fr);} .bubble{max-width:min(680px,82%);}}
@media (max-width: 720px){.app{display:flex;}.bubble{max-width:min(92%,680px);}}


/* 2.17.1 UI stability step 2 */
:root{
  --sidebar-width: 316px;
  --sidebar-width-narrow: 292px;
  --layout-gap: 0px;
  --chat-pad-x: 20px;
  --chat-pad-y: 16px;
  --chat-max: none;
  --bubble-max: min(760px, 72%);
  --panel-strong: linear-gradient(180deg, rgba(247,242,234,.98), rgba(239,230,216,.98));
}

html, body, #app{height:100%;}
body{overflow:hidden;}
.app{
  display:grid;
  grid-template-columns: var(--sidebar-width) minmax(0,1fr);
  gap:var(--layout-gap);
  width:100%;
  min-width:0;
  height:100dvh;
  min-height:100dvh;
}
.sidebar{
  width:auto;
  max-width:none;
  min-width:0;
  min-height:0;
  overflow:hidden;
  background:var(--panel-strong);
}
.main{
  min-width:0;
  min-height:0;
  width:100%;
  display:grid;
  grid-template-rows:auto minmax(0,1fr) auto;
  background:transparent;
}
.topbar,
.search,
.actions,
.sidebarSection{
  flex:0 0 auto;
}
.search,
.actions,
.sidebarSection{
  padding-left:12px;
  padding-right:12px;
}
.sidebarSection{
  padding-top:4px;
  padding-bottom:8px;
}
.list{
  min-height:0;
  padding:8px;
  padding-bottom:14px;
  overscroll-behavior:contain;
}
.item{
  width:100%;
  align-items:center;
  min-height:72px;
  border:1px solid transparent;
}
.item .sub{
  display:flex;
  gap:6px;
  align-items:center;
}
.item .sub .preview{
  min-width:0;
  flex:1;
}
.itemAside{
  flex:0 0 auto;
}
.topbar{
  min-height:64px;
  padding:12px;
}
.topbarMenu{
  top:56px;
  right:12px;
}
.header,
.messages,
.composer,
.empty{
  min-width:0;
}
.header{
  position:relative;
  height:64px;
  min-height:64px;
  padding:12px var(--chat-pad-x);
  background:rgba(247,242,234,.88);
  backdrop-filter:blur(10px);
}
.header .right{
  flex:0 0 auto;
}
.peer{
  min-width:0;
  flex:1 1 auto;
}
.peerMeta{
  min-width:0;
}
.title-link{
  display:block;
  max-width:100%;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.messages{
  width:100%;
  max-width:none;
  min-height:0;
  padding:var(--chat-pad-y) var(--chat-pad-x) 12px;
  gap:10px;
  scroll-behavior:auto;
  overscroll-behavior:contain;
}
.daysep,
.statebox{
  margin-left:auto;
  margin-right:auto;
}
.bubble{
  width:fit-content;
  max-width:var(--bubble-max);
}
.fileCard audio{
  width:min(380px, 100%);
}
.empty{
  padding:20px var(--chat-pad-x);
}
.emptyHero,
.emptyCard{
  width:min(1120px, 100%);
  margin:0 auto;
}
.composer{
  position:relative;
  padding:12px var(--chat-pad-x) calc(12px + env(safe-area-inset-bottom));
  background:rgba(247,242,234,.9);
  backdrop-filter:blur(10px);
}
.composerCol{
  width:100%;
  min-width:0;
}
.composerRow{
  width:100%;
  grid-template-columns:auto auto minmax(0,1fr) auto;
}
#text,
.composer textarea{
  min-width:0;
}
#send{
  min-width:120px;
}
.recOverlay,
.modal-overlay{
  backdrop-filter:blur(6px);
}

@media (max-width: 980px){
  .app{grid-template-columns: var(--sidebar-width-narrow) minmax(0,1fr);}
  :root{--bubble-max:min(700px, 82%);}
}

@media (max-width: 720px){
  body{overflow:auto;}
  .app{display:flex;height:auto;min-height:100dvh;}
  .sidebar,
  .main{height:100dvh;}
  .header{padding:calc(env(safe-area-inset-top) + 10px) 12px 10px; background:rgba(247,242,234,.96);}
  .messages{padding:10px 12px 12px;}
  .composer{padding:8px 10px calc(8px + env(safe-area-inset-bottom)); background:rgba(247,242,234,.97);}
  .bubble{max-width:min(90%, 680px);}
  .topbar,
  .search,
  .actions{background:rgba(247,242,234,.96); backdrop-filter:blur(10px);}
  .topbar{padding:calc(env(safe-area-inset-top) + 10px) 12px 10px;}
  .search{top:calc(env(safe-area-inset-top) + 64px);}
  .actions{top:calc(env(safe-area-inset-top) + 124px);}
}


/* 2.17.3 UI stability step 4 */
:root{
  --sidebar-width: clamp(292px, 24vw, 332px);
  --chat-pad-x: clamp(14px, 2vw, 24px);
  --chat-pad-y: 14px;
  --bubble-max: min(760px, 74%);
  --shell-bg: linear-gradient(180deg, #f8f5ef 0%, #efe7db 100%);
  --surface-strong: linear-gradient(180deg, rgba(247,242,234,.98), rgba(239,230,216,.98));
  --surface-soft: rgba(247,242,234,.92);
}
html,body,#app{height:100%;}
body{overflow:hidden;background:var(--shell-bg) fixed;}
.app{
  display:grid;
  grid-template-columns: var(--sidebar-width) minmax(0, 1fr);
  width:100%;
  min-width:0;
  height:100dvh;
  min-height:100dvh;
}
.sidebar{
  width:auto;
  max-width:none;
  min-width:0;
  min-height:0;
  overflow:hidden;
  background:var(--surface-strong);
}
.main{
  min-width:0;
  min-height:0;
  width:100%;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr) auto;
}
.topbar,.search,.actions,.sidebarSection{flex:0 0 auto;}
.topbar{padding:12px;min-height:64px;}
.search,.actions,.sidebarSection{padding-left:12px;padding-right:12px;}
.sidebarSection{padding-top:4px;padding-bottom:8px;}
.list{min-height:0;overflow:auto;padding:8px 8px 14px;overscroll-behavior:contain;}
.item{width:100%;min-height:72px;border:1px solid transparent;align-items:center;}
.item .sub{display:flex;gap:6px;align-items:center;}
.item .sub .preview{min-width:0;flex:1;}
.itemAside{flex:0 0 auto;}
.topbarMenu{top:56px;right:12px;}
.header,.messages,.composer,.empty{width:100%;min-width:0;max-width:none;}
.header{
  position:relative;
  height:64px;
  min-height:64px;
  padding:12px var(--chat-pad-x);
  background:var(--surface-soft);
  backdrop-filter:blur(10px);
}
.peer{min-width:0;flex:1 1 auto;}
.peerMeta{min-width:0;}
.title-link{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.header .right{flex:0 0 auto;gap:8px;}
.messages{
  min-height:0;
  padding:var(--chat-pad-y) var(--chat-pad-x) 12px;
  scroll-behavior:auto;
  overscroll-behavior:contain;
}
.daysep,.statebox{margin-left:auto;margin-right:auto;}
.bubble{width:fit-content;max-width:var(--bubble-max);}
.fileCard audio{width:min(380px,100%);}
.empty{padding:20px var(--chat-pad-x);}
.emptyHero,.emptyCard{width:min(1120px,100%);margin:0 auto;}
.composer{
  position:relative;
  padding:12px var(--chat-pad-x) calc(12px + env(safe-area-inset-bottom));
  background:var(--surface-soft);
  backdrop-filter:blur(10px);
}
.composerCol{width:100%;min-width:0;}
.composerRow{width:100%;grid-template-columns:auto auto minmax(0,1fr) auto;}
#text,.composer textarea{min-width:0;}
#send{min-width:120px;}
.recOverlay,.modal-overlay{backdrop-filter:blur(6px);}
@media (max-width: 980px){
  :root{--sidebar-width: 292px; --bubble-max:min(700px, 82%);}
}
@media (max-width: 720px){
  body{overflow:auto;}
  .app{display:flex;height:auto;min-height:100dvh;}
  .sidebar,.main{height:100dvh;}
  .topbar,.search,.actions{background:rgba(247,242,234,.96);backdrop-filter:blur(10px);}
  .topbar{padding:calc(env(safe-area-inset-top) + 10px) 12px 10px;}
  .search{top:calc(env(safe-area-inset-top) + 64px);}
  .actions{top:calc(env(safe-area-inset-top) + 124px);}
  .header{padding:calc(env(safe-area-inset-top) + 10px) 12px 10px;background:rgba(247,242,234,.96);}
  .messages{padding:10px 12px 12px;}
  .composer{padding:8px 10px calc(8px + env(safe-area-inset-bottom));background:rgba(247,242,234,.97);}
  .bubble{max-width:min(90%, 680px);}
}


/* 2.17.4 UI stability step 5 */
:root{
  --list-row-gap: 10px;
  --list-row-radius: 14px;
  --chat-surface: rgba(247,242,234,.90);
  --sidebar-surface: linear-gradient(180deg, rgba(247,242,234,.98), rgba(239,230,216,.98));
}
.sidebar{
  background: var(--sidebar-surface);
}
.list{
  padding: 8px;
  gap: 6px;
  content-visibility: auto;
}
.item{
  grid-template-columns: auto minmax(0,1fr) auto;
  display: grid;
  gap: var(--list-row-gap);
  border-radius: var(--list-row-radius);
  padding: 12px;
  align-items: center;
  min-width: 0;
}
.itemMain,
.itemTop,
.item .sub,
.itemAside{
  min-width: 0;
}
.itemTop{
  display:flex;
  align-items:center;
  gap:10px;
}
.itemTop .name{
  min-width:0;
  flex:1 1 auto;
}
.itemTime{
  flex:0 0 auto;
  white-space:nowrap;
}
.item .sub{
  min-width:0;
  overflow:hidden;
}
.item .sub span:first-child{
  flex:0 0 auto;
}
.item .sub .preview{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.itemAside{
  justify-self:end;
}
.header,
.composer{
  background: var(--chat-surface);
}
.messages{
  align-content:flex-start;
}
.empty{
  background: transparent;
}
body[data-theme="midnight"] .sidebar,
body[data-theme="midnight"] .header,
body[data-theme="midnight"] .composer,
body[data-theme="midnight"] .topbar,
body[data-theme="midnight"] .search,
body[data-theme="midnight"] .actions{
  backdrop-filter: blur(10px);
}
@media (max-width: 720px){
  .item{
    padding: 11px 12px;
    gap: 9px;
  }
  .item .sub{
    gap: 4px;
  }
}


/* 2.17.5 mobile compose + overflow + no auto-scroll */
html,body{max-width:100%;overflow-x:hidden;}
#app,.app,.sidebar,.main{max-width:100%;}
.topbarActions{position:relative;}
.composeToggle{font-size:24px;line-height:1;padding:0 18px;}
.composeMenu{position:absolute;top:56px;right:74px;min-width:190px;background:var(--surface-strong, rgba(247,242,234,.98));border:1px solid rgba(0,0,0,.08);border-radius:16px;box-shadow:0 18px 48px rgba(0,0,0,.16);padding:8px;display:flex;flex-direction:column;gap:4px;z-index:50;}
.composeMenu.hidden{display:none !important;}
@media (max-width:720px){
  html,body{overflow-x:hidden !important;}
  body{width:100%;max-width:100vw;}
  .app{display:block !important;position:relative;overflow-x:hidden;overflow-y:auto;width:100%;max-width:100vw;min-height:100dvh;height:auto;}
  .sidebar,.main{width:100% !important;min-width:100% !important;max-width:100% !important;height:100dvh;overflow-x:hidden;}
  .main{display:none !important;}
  .app.mobile-chat .sidebar{display:none !important;}
  .app.mobile-chat .main{display:grid !important;}
  .search,.sidebarSection,.list{width:100%;min-width:0;max-width:100%;}
  .actions{display:none !important;}
  .topbar{grid-template-columns:minmax(0,1fr) auto auto;align-items:center;}
  .topbar .brand{min-width:0;overflow:hidden;}
  .topbar .brand span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .topbarActions{gap:8px;}
  .composeMenu{right:74px;top:calc(env(safe-area-inset-top) + 58px);}
  .topbarMenu{right:12px;top:calc(env(safe-area-inset-top) + 58px);}
  .empty, .emptyHero, .emptyGrid, .emptyMiniCard{max-width:100%;min-width:0;}
  .emptyHero{overflow-wrap:anywhere;}
}


/* 2.17.7 adult chat polish */
.header{
  min-height:74px;
  height:auto;
  align-items:flex-start;
  padding-top:14px;
  padding-bottom:14px;
}
.peer{
  align-items:flex-start;
  gap:12px;
}
.peerMeta{
  padding-top:2px;
  min-width:0;
}
#peerTitle.title-link{
  font-size:clamp(20px, 2.2vw, 28px);
  line-height:1.15;
}
.peerSubline{
  display:flex;
  flex-wrap:wrap;
  gap:6px 10px;
  align-items:center;
  line-height:1.25;
}
#peerSubtitle{
  display:block;
  max-width:100%;
  overflow-wrap:anywhere;
}
.bubble .time{
  font-size:12px;
  font-weight:700;
  letter-spacing:.01em;
  display:flex;
  align-items:center;
  gap:6px;
}
.bubble .time-in{
  color:rgba(92,78,64,.9);
}
.bubble .time-out{
  color:rgba(82,64,50,.92);
  justify-content:flex-end;
}
.timeSep{display:none;}
.receipt{
  display:inline-flex;
  align-items:center;
  font-size:12px;
  font-weight:800;
  letter-spacing:-.08em;
}
.receipt.sent,
.receipt.delivered{color:#3a8dff;}
.receipt.read{color:#14a44d;}

.appModal{
  background:linear-gradient(180deg, rgba(255,255,255,.82), rgba(248,242,234,.96));
  border:1px solid rgba(133,111,84,.16);
  box-shadow:0 30px 80px rgba(82,55,24,.18);
}
.appModal .modal-header{
  padding:18px 20px 14px;
  border-bottom:1px solid rgba(133,111,84,.12);
}
.appModal .modal-title{
  font-size:20px;
  font-weight:800;
  color:#5a4738;
}
.appModalBody{
  padding:18px 20px;
}
.appModal .modal-actions{
  padding:14px 20px 20px;
  border-top:1px solid rgba(133,111,84,.10);
}
.sheetForm,.settingsSheet{display:grid;gap:14px;}
.sheetLead{font-size:14px;line-height:1.5;color:#7b6550;}
.sheetField{display:grid;gap:8px;}
.sheetField label,.sheetTitle{font-size:13px;font-weight:800;color:#614d3d;}
.contactPickerTest{width:100%;justify-content:center;gap:8px;min-height:44px;}
.contactPickerStatus:empty{display:none;}
.sheetCard{display:grid;gap:8px;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.56);border:1px solid rgba(133,111,84,.12);}
.sheetCheck{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:16px;background:rgba(255,255,255,.48);border:1px solid rgba(133,111,84,.10);color:#5f4c3d;}
.sheetCheck input{margin-top:2px;transform:scale(1.12);accent-color:#7d91f6;}
.sheetCheck.compact{padding:9px 11px;background:rgba(255,255,255,.4);}
.sheetActionsRow{display:flex;gap:10px;flex-wrap:wrap;}
.deviceList{display:grid;gap:8px;}
.deviceRow{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid rgba(133,111,84,.1);}
.deviceRow:last-child{border-bottom:0;}.deviceRow>div{display:grid;gap:3px;min-width:0}.deviceRow small{color:var(--muted);font-size:11px;}.currentDevice{display:inline-flex;width:max-content;margin-left:7px;padding:2px 6px;border-radius:999px;background:#e5f0e9;color:#507562;font-size:9px;font-weight:800;}
.securitySettings{gap:10px;}.securityDivider{height:1px;background:rgba(133,111,84,.12);margin:4px 0;}.recoveryCodes{display:grid;gap:9px;padding:12px;border-radius:14px;background:#fffdf7;border:1px solid rgba(133,111,84,.12);}.recoveryCodes pre{margin:0;padding:10px;overflow:auto;border-radius:10px;background:#f5eee6;color:#5a4738;font:12px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;user-select:text;-webkit-user-select:text;}
.dangerZone{border:1px solid rgba(185,80,100,.18);border-radius:17px;background:rgba(185,80,100,.04);overflow:hidden}.dangerZone summary{padding:13px 15px;color:#a44960;font-weight:800;cursor:pointer}.dangerZoneBody{display:grid;gap:10px;padding:0 14px 14px}.dangerZoneBody p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.peerSafetySection{display:flex;align-items:center;justify-content:space-between;gap:16px;}
.disappearingSettings{display:flex;align-items:center;justify-content:space-between;gap:16px}.disappearingSettings select{min-width:150px;padding:10px 12px;border:1px solid rgba(133,111,84,.16);border-radius:14px;background:#fffaf8;color:var(--text);font:inherit}
.profileModal .profileHero,
.peerProfileModal .peerProfileHero,
.settingsModal .sheetCard{
  background:rgba(255,255,255,.58);
  border:1px solid rgba(133,111,84,.10);
  border-radius:22px;
  padding:16px;
}
.profileModal input,
.peerProfileModal input,
.settingsModal input,
.appModalBody .input,
.appModalBody input{
  width:100%;
  border-radius:16px;
  border:1px solid rgba(133,111,84,.16);
  background:rgba(255,255,255,.9);
  color:#4f4034;
  padding:13px 14px;
  outline:none;
}
.profileModal input:focus,
.peerProfileModal input:focus,
.settingsModal input:focus,
.appModalBody input:focus{
  border-color:rgba(125,145,246,.55);
  box-shadow:0 0 0 3px rgba(125,145,246,.12);
}
@media (max-width:720px){
  .sidebar > .topbar{display:flex!important;justify-content:flex-end!important;align-items:center!important;position:relative!important;}
  .sidebar > .topbar .brand{position:absolute!important;left:0!important;right:0!important;top:max(10px,calc(env(safe-area-inset-top) + 8px))!important;bottom:10px!important;transform:none!important;margin:0!important;display:block!important;pointer-events:none!important;}
  .sidebar > .topbar .brandLogo{position:absolute!important;left:12px!important;top:50%!important;transform:translateY(-50%)!important;}
  .sidebar > .topbar .brand span{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;white-space:nowrap;}
  .sidebar > .topbar .profileBtn{display:none!important;}
  .sidebar > .topbar .topbarActions{margin:0!important;gap:4px!important;}
  .sidebar > .topbar .topbarActions .btn{width:36px!important;height:36px!important;min-width:36px!important;padding:0!important;border-radius:13px!important;}
  .header{
    min-height:92px;
    padding-top:calc(env(safe-area-inset-top) + 12px);
    padding-bottom:12px;
  }
  .peer{align-items:flex-start;}
  #peerTitle.title-link{font-size:18px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;}
  .peerSubline{display:block;line-height:1.15;}
  #peerSubtitle{font-size:12px;line-height:1.2;white-space:normal;}
  .appModal{width:min(92vw, 560px);border-radius:22px;max-height:calc(100dvh - 16px);}
  .modal-overlay{align-items:flex-start;padding:calc(env(safe-area-inset-top) + 8px) 12px calc(env(safe-area-inset-bottom) + 12px);}
  .modal{max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 20px);}
}

@media (orientation:landscape) and (max-height:500px) and (min-width:721px){
  .sidebar > .topbar{display:flex!important;justify-content:flex-end!important;align-items:center!important;position:relative!important;padding:8px 10px!important;min-height:58px!important;}
  .sidebar > .topbar .profileBtn{display:none!important;}
  .sidebar > .topbar .brand{position:absolute!important;inset:8px 0!important;display:block!important;margin:0!important;pointer-events:none!important;}
  .sidebar > .topbar .brandLogo{position:absolute!important;left:max(8px,env(safe-area-inset-left))!important;top:50%!important;transform:translateY(-50%)!important;width:36px!important;height:36px!important;border-radius:12px!important;}
  .sidebar > .topbar .brand span{position:absolute!important;left:50%!important;top:50%!important;transform:translate(-50%,-50%)!important;white-space:nowrap!important;font-size:19px!important;}
  .sidebar > .topbar .topbarActions{margin:0!important;position:relative!important;z-index:2!important;}
  .sidebar > .topbar .topbarActions .btn{width:34px!important;height:34px!important;min-width:34px!important;padding:0!important;border-radius:12px!important;}
}

/* DiValis 2.30.10 — Stories music trimmer and popular carousel. */
.storiesTray{
  flex:0 0 auto;
  padding:2px 0 8px;
  border-bottom:1px solid rgba(182,95,123,.08);
}
.storiesHeading{display:flex;align-items:center;justify-content:space-between;padding:0 16px 7px;color:#825664;font-size:11px;letter-spacing:.08em;text-transform:uppercase;}
.storiesHeading strong{font-weight:850}.storiesHeading span{color:#ad8e98;font-size:9px;font-weight:750;letter-spacing:.06em;}
.storiesList{display:flex;gap:10px;overflow-x:auto;padding:0 13px 4px;scroll-snap-type:x proximity;scrollbar-width:none;overscroll-behavior-x:contain;}
.storiesList::-webkit-scrollbar{display:none}
.storyCard{position:relative;flex:0 0 66px;scroll-snap-align:start;text-align:center;}
.storyCardMain{width:100%;padding:0;border:0;background:transparent;color:#795662;cursor:pointer;display:grid;justify-items:center;gap:4px;}
.storyRing{position:relative;width:58px;height:58px;padding:2.5px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#d66d8d,#b65779 55%,#d7a56d);box-shadow:0 5px 14px rgba(140,73,96,.12);}
.storyRing.seen{background:#d7c5c8;box-shadow:none}.storyRing.empty{background:#eadcdf;box-shadow:none;}
.storyRing.empty.addOnly{
  padding:0;
  border:1.5px dashed rgba(181,84,116,.42);
  background:linear-gradient(145deg,rgba(255,252,245,.98),rgba(250,231,232,.96));
  box-shadow:0 5px 15px rgba(140,73,96,.09),inset 0 0 0 4px rgba(255,255,255,.58);
  color:#be587c;
}
.storyEmptyAddMark{width:100%;height:100%;display:grid;place-items:center;border-radius:50%;}
.storyEmptyAddMark .uiIcon{width:25px;height:25px;stroke-width:1.8;filter:drop-shadow(0 2px 3px rgba(148,65,94,.12));}
.storyCardMain:active .storyRing.empty.addOnly{transform:scale(.94);box-shadow:0 2px 8px rgba(140,73,96,.08);}
.storyRing.processing,.storyHubRing.processing{background:conic-gradient(from 20deg,#cc6686,#e2a477,#f0d2b4,#bb5478,#cc6686);box-shadow:0 6px 17px rgba(160,73,104,.2)}
.storyRing.processing::after,.storyHubRing.processing::after{content:"";position:absolute;inset:-3px;border:2px solid transparent;border-top-color:#fff6e9;border-right-color:rgba(255,246,233,.55);border-radius:50%;pointer-events:none;animation:storyPendingSpin .9s linear infinite;filter:drop-shadow(0 1px 2px rgba(117,57,76,.22))}
.storyPendingGlyph{position:absolute;inset:0;z-index:2;display:grid;place-items:center;border-radius:50%;background:rgba(68,38,47,.18);backdrop-filter:blur(1.5px);-webkit-backdrop-filter:blur(1.5px);pointer-events:none}
.storyPendingGlyph i,.storyHubProcessing i{display:block;width:18px;height:18px;border:2px solid rgba(255,255,255,.42);border-top-color:#fff;border-radius:50%;animation:storyPendingSpin .78s linear infinite}
@keyframes storyPendingSpin{to{transform:rotate(360deg)}}
.storyAvatar{width:100%;height:100%;border:2px solid #fffaf8;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#f4dde2,#ecd5ce);color:#8a4562;font-size:17px;font-weight:800;}
.storyAvatar img{width:100%;height:100%;display:block;object-fit:cover;}
.storyPreviewMedia{position:relative;width:100%;height:100%;display:block;overflow:hidden;border-radius:50%;background:linear-gradient(145deg,#eed8de,#d8bdc5);}
.storyPreviewMedia img,.storyPreviewMedia video{width:100%;height:100%;display:block;object-fit:cover;}
.storyPreviewPlay{position:absolute;right:3px;bottom:3px;width:18px;height:18px;border:1px solid rgba(255,255,255,.74);border-radius:50%;display:grid;place-items:center;background:rgba(35,25,30,.62);color:#fff;box-shadow:0 2px 7px rgba(0,0,0,.25);backdrop-filter:blur(5px);}
.storyPreviewPlay .uiIcon{width:9px;height:9px;fill:currentColor;stroke-width:1.5;transform:translateX(.5px);}
.storyCardName{display:block;width:66px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10.5px;font-weight:700;}
.storyAddButton{position:absolute;right:5px;top:39px;width:20px;height:20px;padding:0;border:2px solid #fffaf8;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#b95779,#dd8fa5);color:#fff;box-shadow:0 4px 11px rgba(153,74,101,.22);cursor:pointer;z-index:2;}
.storyAddButton .uiIcon{width:11px;height:11px;stroke-width:2.4;}
.storyAddButton:active{transform:scale(.92);}
.avatar.avatarInteractive{cursor:zoom-in;}
#list .avatar.hasStory{overflow:visible;position:relative;border:0!important;padding:2px;background:linear-gradient(145deg,#d46b8b,#ba587b 58%,#d7a46e)!important;}
#list .avatar.hasStory.storySeen{background:#d4c2c6!important;}
#list .avatar.hasStory img,#list .avatar.hasStory>.avatarPlaceholder{width:100%;height:100%;border:2px solid #fffaf8;border-radius:50%;object-fit:cover;display:grid;place-items:center;background:#f1dce0;overflow:hidden;}

.storiesHub{
  position:fixed;inset:0;z-index:3400;display:flex;flex-direction:column;
  color:#563e47;background:
    radial-gradient(circle at 92% 8%,rgba(225,151,168,.18),transparent 28%),
    radial-gradient(circle at 7% 91%,rgba(221,190,145,.16),transparent 30%),
    linear-gradient(180deg,#fff9f1 0%,#faeee8 100%);
  transform:translateX(-100%);opacity:.98;transition:transform .18s cubic-bezier(.22,.82,.26,1),opacity .18s ease;
  overflow:hidden;overscroll-behavior:none;touch-action:pan-y;
}
.storiesHub.open{transform:translateX(0);opacity:1}.storiesHub.closing{pointer-events:none}
body.stories-hub-open{overflow:hidden!important}
.storiesHubHeader{
  flex:0 0 auto;min-height:78px;padding:calc(max(10px,env(safe-area-inset-top)) + 7px) max(14px,env(safe-area-inset-right)) 10px max(14px,env(safe-area-inset-left));
  display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:10px;
  border-bottom:1px solid rgba(175,96,120,.12);background:rgba(255,249,242,.86);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
}
.storiesHubHeading{display:grid;justify-items:center;gap:2px;min-width:0}.storiesHubHeading strong{font-family:Georgia,"Times New Roman",serif;font-size:25px;color:#74384f;letter-spacing:.02em}.storiesHubHeading span{font-size:10.5px;color:#a17b87;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;}
.storiesHubIcon{width:42px;height:42px;padding:0;border:1px solid rgba(175,96,120,.16);border-radius:15px;display:grid;place-items:center;background:rgba(255,255,255,.66);color:#865069;box-shadow:0 6px 18px rgba(111,58,76,.07);cursor:pointer;}
.storiesHubIcon.accent{border-color:rgba(184,78,113,.22);background:linear-gradient(145deg,#d77391,#b84e71);color:#fff;box-shadow:0 7px 18px rgba(152,57,91,.2)}.storiesHubIcon .uiIcon{width:20px;height:20px;}
.storiesHubContent{flex:1;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:18px max(16px,env(safe-area-inset-right)) calc(26px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));}
.storiesHubSection{width:min(100%,720px);margin:0 auto 22px}.storiesHubSectionTitle{min-height:30px;padding:0 5px 8px;display:flex;align-items:end;justify-content:space-between;gap:12px;color:#7b5361}.storiesHubSectionTitle strong{font-size:14px;font-weight:850;letter-spacing:.025em}.storiesHubSectionTitle span{font-size:10.5px;color:#ae8c97;}
.storyHubOwnCard{display:flex;align-items:stretch;gap:10px;padding:10px;border:1px solid rgba(174,94,120,.14);border-radius:24px;background:rgba(255,255,255,.66);box-shadow:0 12px 32px rgba(114,64,80,.08);}
.storyHubOwnerMain{min-width:0;flex:1;padding:2px;border:0;background:transparent;color:inherit;display:flex;align-items:center;gap:13px;text-align:left;cursor:pointer;}
.storyHubRing{position:relative;width:66px;height:66px;flex:0 0 66px;padding:3px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#d66d8d,#b65779 55%,#d7a56d);box-shadow:0 6px 16px rgba(140,73,96,.13)}.storyHubRing.seen{background:#d7c5c8;box-shadow:none}.storyHubRing.empty{background:#eadcdf;box-shadow:none}.storyHubAvatar{width:100%;height:100%;border:2.5px solid #fffaf6;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#f3dce1,#ead5cf);color:#884c63;font-size:19px;font-weight:850}.storyHubAvatar img{width:100%;height:100%;display:block;object-fit:cover}.storyHubAvatar .uiIcon{width:23px;height:23px;}
.storyHubRowCopy{min-width:0;flex:1;display:grid;gap:5px}.storyHubRowCopy strong{font-size:15px;font-weight:850;color:#613f4c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.storyHubRowCopy>span{font-size:11.5px;color:#9b7c87;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.storyHubViews{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;color:#9b6678;font-size:11px;font-weight:800}.storyHubViews .uiIcon{width:15px;height:15px;}
.storyHubProcessing{flex:0 0 auto;min-width:34px;height:28px;padding:0 8px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;gap:5px;background:linear-gradient(135deg,#c86182,#dd8f83);color:#fff;font-size:10px;font-weight:850;box-shadow:0 5px 13px rgba(159,66,97,.17)}.storyHubProcessing i{width:12px;height:12px;border-width:1.5px}
.storyHubAddButton{flex:0 0 76px;border:0;border-radius:18px;display:grid;place-items:center;align-content:center;gap:5px;background:linear-gradient(145deg,#f3d8df,#f8ebe6);color:#9b4969;font:inherit;font-size:10.5px;font-weight:800;cursor:pointer;}.storyHubAddButton .uiIcon{width:23px;height:23px;stroke-width:2.2;}
.storiesHubRows{display:grid;gap:8px}.storyHubRow{width:100%;min-height:78px;padding:8px 12px 8px 9px;border:1px solid rgba(174,94,120,.11);border-radius:22px;display:flex;align-items:center;gap:13px;background:rgba(255,255,255,.55);color:inherit;text-align:left;box-shadow:0 8px 23px rgba(114,64,80,.055);cursor:pointer}.storyHubRow:active,.storyHubOwnerMain:active{transform:scale(.992)}.storyHubRow .storyHubRing{width:58px;height:58px;flex-basis:58px;padding:2.5px}.storyHubRow .storyHubAvatar{font-size:17px;border-width:2px;}
.storyHubStatus{flex:0 0 auto;max-width:88px;padding:5px 8px;border-radius:999px;background:#ede0e2;color:#91737d;font-size:10px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.storyHubStatus.unseen{background:linear-gradient(135deg,#d87391,#bd5577);color:#fff;box-shadow:0 4px 11px rgba(164,63,98,.18)}
.storiesHubEmpty{width:min(100%,520px);margin:34px auto 0;padding:30px 24px;border:1px dashed rgba(174,94,120,.2);border-radius:26px;display:grid;justify-items:center;text-align:center;background:rgba(255,255,255,.42);}.storiesHubEmptyMark{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#f2dfe3;color:#9f5670;margin-bottom:13px}.storiesHubEmptyMark .uiIcon{width:25px;height:25px}.storiesHubEmpty strong{font-size:17px;color:#704858}.storiesHubEmpty p{max-width:370px;margin:8px 0 18px;color:#9b7c87;font-size:12px;line-height:1.5}.storiesHubEmpty .btn{min-width:210px;}

.storyViewer{position:fixed;inset:0;z-index:5000;background:#000;color:#fff;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none;container-type:size;}
.storyViewer.hidden{display:none!important;}
.storyProgress,.storyViewerHeader,.storyMusicBadge,.storyOwnerBar{transition:opacity .18s ease,visibility .18s ease;}
.storyViewer.chrome-hidden .storyProgress,.storyViewer.chrome-hidden .storyViewerHeader,.storyViewer.chrome-hidden .storyMusicBadge,.storyViewer.chrome-hidden .storyOwnerBar{opacity:0!important;visibility:hidden!important;pointer-events:none!important;}
.storyViewer.chrome-hidden .storyMediaStage,.storyViewer.chrome-hidden .storyCaption,.storyViewer.chrome-hidden .storyPlaybackTextCanvas,.storyViewer.chrome-hidden .storyPlaybackText{opacity:1!important;visibility:visible!important;}
.storyViewer.is-loading .storyMediaStage,.storyViewer.is-loading .storyCaption,.storyViewer.is-loading .storyMusicBadge{opacity:0;}
.storyViewer.is-loading::before{content:"";position:absolute;z-index:20;left:50%;top:50%;width:42px;height:42px;margin:-21px;border:3px solid rgba(255,255,255,.22);border-top-color:#fff;border-radius:50%;animation:storyLoadSpin .78s linear infinite;}
.storyViewer.is-loading::after{content:"Загружаем историю";position:absolute;z-index:20;left:50%;top:calc(50% + 38px);transform:translateX(-50%);color:rgba(255,255,255,.74);font-size:11px;font-weight:720;letter-spacing:.03em;white-space:nowrap;}
@keyframes storyLoadSpin{to{transform:rotate(360deg)}}
body.story-viewer-open{overflow:hidden!important;background:#000!important;}
body.story-viewer-open::before{background:#000!important;opacity:1!important;}
.storyProgress{position:absolute;z-index:8;top:max(9px,env(safe-area-inset-top));left:10px;right:10px;height:3px;display:flex;gap:4px;}
.storyProgressSegment{flex:1;min-width:0;height:3px;border-radius:999px;background:rgba(255,255,255,.28);overflow:hidden;}
.storyProgressFill{display:block;width:100%;height:100%;border-radius:inherit;background:#fff;transform:scaleX(0);transform-origin:left center;will-change:transform;}
.storyViewerHeader{position:absolute;z-index:8;top:calc(max(9px,env(safe-area-inset-top)) + 12px);left:0;right:0;min-height:54px;padding:8px 13px;display:flex;align-items:center;gap:10px;background:linear-gradient(180deg,rgba(0,0,0,.62),transparent);}
.storyViewerAvatar{width:38px;height:38px;flex:0 0 38px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:#49363d;border:1px solid rgba(255,255,255,.38);font-weight:800;}
.storyViewerAvatar img{width:100%;height:100%;object-fit:cover;}.storyViewerAvatar .uiIcon{width:18px;height:18px;}
.storyViewerIdentity{display:grid;gap:2px;min-width:0;flex:1;text-shadow:0 1px 8px rgba(0,0,0,.72);}
.storyViewerIdentity strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.storyViewerIdentity time{font-size:11px;color:rgba(255,255,255,.72);}
.storyViewerIcon{width:40px;height:40px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:rgba(22,18,20,.38);color:#fff;backdrop-filter:blur(12px);cursor:pointer;}
.storyViewerIcon .uiIcon{width:21px;height:21px;}
.storyMediaStage{--story-view-scale:1;--story-view-x:0px;--story-view-y:0px;position:absolute;z-index:1;left:50%;top:50%;width:min(100%,56.25dvh);max-width:100%;max-height:100%;aspect-ratio:9/16;transform:translate(-50%,-50%) translate3d(var(--story-view-x),var(--story-view-y),0) scale(var(--story-view-scale));transform-origin:center;display:grid;place-items:center;overflow:hidden;background:#000;will-change:transform;}
.storyMediaStage.zoom-animating{transition:transform .22s cubic-bezier(.2,.8,.2,1)}
.storyViewer.is-zoomed .storyMediaStage{cursor:grab}.storyViewer.is-zoomed .storyMediaStage:active{cursor:grabbing}
@supports (width:1cqw){.storyMediaStage{width:min(100cqw,56.25cqh);height:min(100cqh,177.7778cqw);max-width:none;max-height:none;}}
.storyMedia{display:block;width:100%;height:100%;object-fit:cover;background:#000;}
.storyNav{position:absolute;z-index:5;top:76px;bottom:94px;width:34%;border:0;background:transparent;padding:0;cursor:pointer;}
.storyNavPrevious{left:0}.storyNavNext{right:0}
.storyCaption{position:absolute;z-index:7;left:50%;bottom:calc(72px + env(safe-area-inset-bottom));transform:translateX(-50%);width:min(92%,680px);padding:10px 14px;border-radius:15px;background:rgba(0,0,0,.48);color:#fff;text-align:center;font-size:14px;line-height:1.42;text-shadow:0 1px 4px rgba(0,0,0,.5);backdrop-filter:blur(12px);}
.storyOwnerBar{position:absolute;z-index:9;left:0;right:0;bottom:0;min-height:64px;padding:8px 14px max(9px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;gap:9px;background:linear-gradient(0deg,rgba(0,0,0,.7),transparent);}
.storyOwnerButton{min-height:38px;padding:7px 13px;border:1px solid rgba(255,255,255,.22);border-radius:999px;display:inline-flex;align-items:center;gap:7px;background:rgba(22,18,20,.46);color:#fff;font:inherit;font-size:12px;font-weight:760;backdrop-filter:blur(12px);cursor:pointer;}
.storyOwnerButton .uiIcon{width:17px;height:17px;}.storyOwnerButton.danger{color:#ffd3da;border-color:rgba(255,112,135,.35);}
.storyOwnerButton.accent{border-color:rgba(255,194,215,.52);background:linear-gradient(135deg,rgba(195,73,115,.92),rgba(222,125,151,.88));box-shadow:0 6px 20px rgba(130,35,72,.28);}
.storyViewersSheet{position:absolute;z-index:15;left:50%;bottom:0;width:min(100%,520px);max-height:min(72dvh,620px);transform:translateX(-50%);display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.12);border-bottom:0;border-radius:25px 25px 0 0;background:rgba(35,27,31,.97);box-shadow:0 -20px 70px rgba(0,0,0,.4);backdrop-filter:blur(25px);padding-bottom:env(safe-area-inset-bottom);}
.storyViewersSheet.hidden{display:none!important}.storySheetHandle{width:42px;height:4px;margin:8px auto 1px;border-radius:9px;background:rgba(255,255,255,.3);}
.storySheetHeader{min-height:52px;padding:6px 10px 6px 17px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.1);}.storySheetHeader strong{font-size:16px;}
.storyViewersList{overflow:auto;padding:7px 10px 14px;}
.storyViewerRow{display:flex;align-items:center;gap:11px;min-height:58px;padding:8px;border-radius:15px;}.storyViewerRow:hover{background:rgba(255,255,255,.06);}
.storyViewerRow .avatar{width:42px;height:42px;min-width:42px;border-radius:50%;}.storyViewerRow>span{display:grid;gap:3px;min-width:0;}.storyViewerRow strong{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.storyViewerRow time{color:rgba(255,255,255,.56);font-size:11px;}
.storyViewerEmpty{padding:28px 12px;text-align:center;color:rgba(255,255,255,.62);font-size:13px;}
.storyPublishModal{width:min(94vw,540px)!important}.storyPublishBody{display:flex;flex-direction:column;gap:13px;}
.storyPublishPreview{height:min(52vh,520px);border-radius:20px;overflow:hidden;background:#140f11;display:grid;place-items:center;}.storyPublishPreview img,.storyPublishPreview video{width:100%;height:100%;object-fit:contain;display:block;}
.storyPublishBody textarea{width:100%;min-height:62px;padding:12px 14px;resize:vertical;border:1px solid rgba(166,102,124,.2);border-radius:15px;background:#fffaf8;color:#563e47;font:inherit;outline:none;}
.storyPublishHint{text-align:center;color:#9a7b85;font-size:11px;}.storyUploadProgress{height:5px;border-radius:999px;background:rgba(182,95,123,.13);overflow:hidden;}.storyUploadProgress span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#b95a7c,#df92a6);transition:width .15s linear;}
.storyMusicEditor{flex:0 0 auto;min-height:64px;border:1px solid rgba(174,94,120,.16);border-radius:18px;background:linear-gradient(145deg,rgba(255,250,245,.94),rgba(250,235,236,.84));overflow:hidden;box-shadow:0 10px 28px rgba(100,55,70,.06)}
.storyMusicToggle{width:100%;min-height:62px;padding:9px 13px;border:0;background:transparent;color:#684652;display:flex;align-items:center;gap:11px;text-align:left;font:inherit;cursor:pointer}.storyMusicToggleIcon{width:40px;height:40px;flex:0 0 40px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(145deg,#d06487,#ab4d70);color:#fff;box-shadow:0 7px 16px rgba(158,65,96,.2)}.storyMusicToggleIcon .uiIcon{width:20px;height:20px}.storyMusicToggle>span:nth-child(2){min-width:0;flex:1;display:grid;gap:3px}.storyMusicToggle strong{font-size:13.5px}.storyMusicToggle small{color:#9e7b87;font-size:10.5px}.storyMusicToggle>.uiIcon{width:17px;height:17px;color:#9e6578}
.storyMusicPanel{padding:0 11px 12px;border-top:1px solid rgba(174,94,120,.12)}.storyMusicSearch{display:flex;gap:7px;padding-top:11px}.storyMusicSearch input{min-width:0;flex:1;height:39px;border:1px solid rgba(166,102,124,.2);border-radius:13px;background:#fffdf9;padding:0 12px;color:#553d46;font:inherit;font-size:12px;outline:none}.storyMusicSearch input:focus{border-color:#c76987;box-shadow:0 0 0 3px rgba(199,105,135,.1)}.storyMusicSearch .btn{height:39px;border-radius:13px}.storyMusicSourceRow{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#a0828c;font-size:10.5px}.storyMusicUpload{height:30px!important;min-height:30px!important;padding:5px 10px!important;font-size:10.5px!important;cursor:pointer}
.storyMusicResults{max-height:220px;overflow:auto;display:grid;gap:5px;overscroll-behavior:contain}.storyMusicResult{width:100%;min-height:56px;padding:6px;border:0;border-radius:14px;background:rgba(255,255,255,.68);display:flex;align-items:center;gap:9px;color:#60434d;text-align:left;font:inherit;cursor:pointer}.storyMusicResult:active{transform:scale(.992);background:#fff}.storyMusicResult img,.storyMusicArtworkFallback{width:44px;height:44px;flex:0 0 44px;border-radius:12px;object-fit:cover;display:grid;place-items:center;background:linear-gradient(145deg,#ead2d8,#f7e9e4);color:#a55571}.storyMusicArtworkFallback .uiIcon{width:20px;height:20px}.storyMusicResult>span:nth-child(2){min-width:0;flex:1;display:grid;gap:3px}.storyMusicResult strong,.storyMusicResult small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.storyMusicResult strong{font-size:12px}.storyMusicResult small{font-size:10px;color:#9a7a85}.storyMusicAdd{width:29px;height:29px;flex:0 0 29px;border-radius:50%;display:grid;place-items:center;background:#f3dce2;color:#a74e6c}.storyMusicAdd .uiIcon{width:15px;height:15px}.storyMusicEmpty,.storyMusicLoading{padding:18px 10px;text-align:center;color:#997b85;font-size:11px}.storyMusicLoading{display:flex;align-items:center;justify-content:center;gap:8px}.storyMusicLoading>span{width:15px;height:15px;border:2px solid #e5c9d1;border-top-color:#b55b79;border-radius:50%;animation:storyMusicSpin .8s linear infinite}@keyframes storyMusicSpin{to{transform:rotate(360deg)}}
.storyMusicSelected{margin-top:6px;padding:9px;border:1px solid rgba(174,94,120,.16);border-radius:16px;background:rgba(255,255,255,.74)}.storyMusicSelectedHead{display:flex;align-items:center;gap:9px}.storyMusicSelectedHead>img{width:48px;height:48px;flex:0 0 48px;border-radius:13px;object-fit:cover}.storyMusicSelectedHead>span:nth-child(2){min-width:0;flex:1;display:grid;gap:3px}.storyMusicSelectedHead strong,.storyMusicSelectedHead small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.storyMusicSelectedHead strong{font-size:12.5px;color:#60434d}.storyMusicSelectedHead small{font-size:10px;color:#9b7b85}.storyMusicPlay,.storyMusicRemove{width:34px;height:34px;flex:0 0 34px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;color:#fff;background:#bc5a7a;cursor:pointer}.storyMusicRemove{width:30px;height:30px;flex-basis:30px;background:#f0dde1;color:#9d6476}.storyMusicPlay .uiIcon,.storyMusicRemove .uiIcon{width:16px;height:16px}
.storyMusicTimeline,.storyMusicMix{display:grid;gap:8px;margin-top:11px}.storyMusicMix label{display:grid;gap:5px}.storyMusicTimelineLabels{display:flex;align-items:center;justify-content:space-between;gap:12px;color:#94727e;font-size:10px}.storyMusicTimelineLabels>span:last-child{text-align:right}.storyMusicTimeline b{color:#6f4c58;font-variant-numeric:tabular-nums}.storyMusicRangeTrack{--clip-start:0%;--clip-end:50%;position:relative;width:100%;height:40px;margin:-5px 0;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none;background:linear-gradient(to right,#ead7dc 0 var(--clip-start),#bb5b7a var(--clip-start) var(--clip-end),#ead7dc var(--clip-end) 100%) center/100% 5px no-repeat;border-radius:999px}.storyMusicRangeTrack input{position:absolute;inset:0;width:100%;height:40px;margin:0;border:0;background:transparent;appearance:none;-webkit-appearance:none;pointer-events:none}.storyMusicRangeTrack input::-webkit-slider-runnable-track{height:5px;background:transparent}.storyMusicRangeTrack input::-webkit-slider-thumb{width:22px;height:22px;margin-top:-9px;border:2px solid #fff;border-radius:50%;background:#bb5b7a;box-shadow:0 2px 9px rgba(116,47,71,.32);appearance:none;-webkit-appearance:none;pointer-events:none;transition:transform .12s ease,box-shadow .12s ease}.storyMusicRangeTrack input::-moz-range-track{height:5px;background:transparent}.storyMusicRangeTrack input::-moz-range-thumb{width:18px;height:18px;border:2px solid #fff;border-radius:50%;background:#bb5b7a;box-shadow:0 2px 9px rgba(116,47,71,.32);pointer-events:none}.storyMusicRangeTrack.is-dragging input::-webkit-slider-thumb{transform:scale(1.08);box-shadow:0 3px 13px rgba(116,47,71,.4)}.storyMusicMix label>span{display:flex;justify-content:space-between;color:#94727e;font-size:10px}.storyMusicMix input{width:100%;height:18px;margin:0;accent-color:#bb5b7a}.storyMusicMix{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.storyMusicBadge{position:absolute;z-index:8;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));transform:translateX(-50%);max-width:min(78%,390px);min-height:38px;padding:4px 10px 4px 5px;border:1px solid rgba(255,255,255,.18);border-radius:13px;display:flex;align-items:center;gap:7px;background:rgba(24,18,21,.5);color:#fff;box-shadow:0 6px 20px rgba(0,0,0,.22);backdrop-filter:blur(16px);text-shadow:0 1px 5px rgba(0,0,0,.4)}.storyViewer:has(.storyOwnerBar:not(.hidden)) .storyMusicBadge{bottom:calc(58px + env(safe-area-inset-bottom))}.storyMusicBadge img,.storyMusicBadgeFallback{width:30px;height:30px;flex:0 0 30px;border-radius:8px;object-fit:cover;display:grid;place-items:center;background:rgba(255,255,255,.14)}.storyMusicBadgeFallback .uiIcon{width:15px;height:15px}.storyMusicBadge>span:last-child{min-width:0;display:grid;gap:1px}.storyMusicBadge strong,.storyMusicBadge small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.storyMusicBadge strong{font-size:10.5px}.storyMusicBadge small{font-size:8.8px;color:rgba(255,255,255,.72)}.storyMusicBadge.storyMusicUnavailable{opacity:.55}.storyMusicAudio{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.storyPublishBody:has(.storyMusicPanel:not(.hidden)){max-height:min(76dvh,760px);overflow:auto;overscroll-behavior:contain}.storyPublishBody:has(.storyMusicPanel:not(.hidden)) .storyPublishPreview{height:min(31dvh,300px)}

@media (max-width:720px){
  .sidebar{touch-action:pan-y;}
  .storiesTray{padding-bottom:7px}.storiesHeading{padding-left:14px;padding-right:14px}.storiesList{padding-left:11px;padding-right:11px;}
  .storiesHubHeader{min-height:72px;grid-template-columns:40px minmax(0,1fr) 40px;padding-left:max(10px,env(safe-area-inset-left));padding-right:max(10px,env(safe-area-inset-right));}.storiesHubIcon{width:38px;height:38px;border-radius:14px}.storiesHubHeading strong{font-size:23px}.storiesHubContent{padding-top:14px}.storiesHubSection{margin-bottom:18px}.storyHubOwnCard{border-radius:21px;padding:9px}.storyHubRing{width:62px;height:62px;flex-basis:62px}.storyHubAddButton{flex-basis:70px;border-radius:16px}.storyHubRow{min-height:72px;border-radius:20px}.storyHubRow .storyHubRing{width:54px;height:54px;flex-basis:54px}.storyHubStatus{max-width:76px;}
  .storyViewerHeader{top:calc(max(8px,env(safe-area-inset-top)) + 11px)}
  .storyNav{top:72px;bottom:84px;width:38%;}
  .storyCaption{bottom:calc(69px + env(safe-area-inset-bottom));font-size:13px;}
  .storyPublishModal{width:100%!important}.storyPublishPreview{height:min(50dvh,470px);border-radius:17px;}.storyMusicBadge{max-width:88%;}.storyMusicMix{grid-template-columns:1fr}.storyPublishBody:has(.storyMusicPanel:not(.hidden)) .storyPublishPreview{height:min(27dvh,240px)}
}
@media (orientation:landscape) and (max-height:500px){
  .storyViewerHeader{min-height:46px;padding-top:4px;padding-bottom:4px}.storyViewerAvatar{width:34px;height:34px;flex-basis:34px;}
  .storyOwnerBar{min-height:50px}.storyCaption{bottom:54px;max-width:68%;padding:7px 11px;}.storyNav{top:58px;bottom:52px;}
}
@media (prefers-reduced-motion:reduce){.storyUploadProgress span{transition:none}}
body.story-viewer-open .modal-overlay{z-index:6000;}

/* 2.30.10: keep the story music editor reachable and make the chosen clip explicit. */
.storyPublishBody{max-height:min(76dvh,760px);overflow-y:auto;scroll-padding-top:8px;}
.storyPublishPreview{height:min(42vh,420px);}
.storyMusicToggle>.uiIcon{transition:transform .2s ease;}
.storyMusicToggle.open>.uiIcon{transform:rotate(180deg);}
.storyMusicSelected{margin-top:11px;padding:10px;background:rgba(255,255,255,.82);box-shadow:0 8px 22px rgba(112,59,76,.06);}
.storyMusicFragmentSummary{margin-top:10px;padding:9px 10px;border-radius:12px;background:linear-gradient(135deg,#f8e8ec,#fff8f4);display:flex;align-items:center;justify-content:space-between;gap:8px;color:#9a7380;font-size:10px;}
.storyMusicFragmentSummary strong{color:#6b4855;font-size:11px;font-variant-numeric:tabular-nums;white-space:nowrap;}
.storyMusicDurationBlock{display:grid;gap:6px;}
.storyMusicDurationBlock>span{display:flex;justify-content:space-between;color:#94727e;font-size:10px;}
.storyMusicDurationBlock b{color:#6f4c58;font-variant-numeric:tabular-nums;}
.storyMusicDurationChoices{display:flex;gap:6px;overflow-x:auto;padding:1px 0 2px;scrollbar-width:none;}
.storyMusicDurationChoices::-webkit-scrollbar{display:none;}
.storyMusicDurationChoice{min-width:45px;height:31px;padding:0 10px;border:1px solid rgba(172,91,119,.15);border-radius:999px;background:#fff8f6;color:#8c6875;font:inherit;font-size:10.5px;font-weight:750;cursor:pointer;}
.storyMusicDurationChoice.active{border-color:transparent;background:linear-gradient(135deg,#bc5a7a,#d8849c);color:#fff;box-shadow:0 5px 12px rgba(177,79,113,.18);}
.storyMusicRangeTrack,.storyMusicRangeTrack input{height:40px;}
.storyMusicTimeline input:disabled{opacity:.38;}
.storyMusicApply{width:100%;min-height:40px;margin-top:11px;border-radius:13px;}
.storyMusicAppliedActions{margin-top:10px;display:flex;align-items:center;justify-content:space-between;gap:9px;}.storyMusicAppliedActions>span{color:#9b7b85;font-size:9.5px;text-align:right}.storyMusicBack{display:inline-flex!important;align-items:center;gap:5px;white-space:nowrap}.storyMusicBack .uiIcon{width:14px;height:14px}.storyMusicPanel.has-applied .storyMusicSearch,.storyMusicPanel.has-applied .storyMusicSourceRow,.storyMusicPanel.has-applied .storyMusicPopularSection,.storyMusicPanel.has-applied .storyMusicResults{display:none!important;}
.storyMusicPanel.has-search .storyMusicPopularSection{display:none}.storyMusicPanel.has-search .storyMusicResults{max-height:min(42dvh,360px)}
.storyMusicPopularSection{display:grid;gap:7px;margin:2px 0 9px}.storyMusicPopularHead{display:flex;align-items:center;justify-content:space-between;gap:10px}.storyMusicPopularHead>span:first-child{display:grid;gap:2px}.storyMusicPopularHead strong{color:#6c4b57;font-size:11.5px}.storyMusicPopularHead small{color:#a1848e;font-size:9.5px}.storyMusicPopularHead>span:last-child{display:flex;gap:5px}.storyMusicPopularHead button{width:29px;height:29px;padding:0;border:1px solid rgba(172,91,119,.14);border-radius:50%;display:grid;place-items:center;background:#fff9f6;color:#9d5f75;cursor:pointer}.storyMusicPopularHead button .uiIcon{width:14px;height:14px}.storyMusicPopularViewport{width:100%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;touch-action:auto}.storyMusicPopularViewport::-webkit-scrollbar{display:none}.storyMusicPopular{width:100%;max-width:none;display:flex;gap:0;padding:1px 0 5px}.storyMusicPopularCard{position:relative;box-sizing:border-box;width:100%;min-width:100%;min-height:150px;padding:10px;border:1px solid transparent;border-radius:15px;display:grid;grid-template-columns:118px minmax(0,1fr);align-items:center;gap:13px;scroll-snap-align:start;scroll-snap-stop:always;background:rgba(255,255,255,.72);color:#684955;text-align:left;font:inherit;cursor:pointer;transition:border-color .16s ease,box-shadow .16s ease}.storyMusicPopularCard.is-previewing{border-color:rgba(188,90,122,.48);box-shadow:0 7px 18px rgba(153,67,96,.13)}.storyMusicPopularCard>img,.storyMusicPopularCard>.storyMusicArtworkFallback{width:118px;height:118px;flex:0 0 118px;border-radius:13px;object-fit:cover}.storyMusicPopularCard>span:nth-child(2){min-width:0;display:grid;gap:5px}.storyMusicPopularCard strong,.storyMusicPopularCard small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.storyMusicPopularCard strong{font-size:13px}.storyMusicPopularCard small{font-size:10.5px;color:#a0808b}.storyMusicPopularPlay{position:absolute;left:91px;top:96px;width:34px;height:34px;padding:0;border:2px solid #fff;border-radius:50%;display:grid;place-items:center;background:rgba(78,47,58,.76);color:#fff;box-shadow:0 4px 12px rgba(45,21,29,.24);cursor:pointer}.storyMusicPopularPlay .uiIcon{width:15px;height:15px}.storyMusicPopularAdd{position:absolute;right:12px;bottom:12px;width:27px;height:27px;border:2px solid #fff;border-radius:50%;display:grid;place-items:center;background:#bd5d7d;color:#fff;box-shadow:0 4px 10px rgba(139,57,85,.2)}.storyMusicPopularAdd .uiIcon{width:13px;height:13px}
.storyPublishBody:has(.storyMusicPanel:not(.hidden)) .storyPublishPreview{height:min(24dvh,230px);}
@media (max-width:720px){
  .storyPublishModal{height:calc(100vh - 20px);height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 20px);max-height:none!important;}
  .storyPublishBody{min-height:0;max-height:none!important;overflow-y:scroll!important;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;padding-top:10px;}
  .storyPublishPreview{height:min(34dvh,330px);}
  .storyPublishBody:has(.storyMusicPanel:not(.hidden)) .storyPublishPreview{height:min(20dvh,190px);}
  .storyMusicPanel{padding-left:9px;padding-right:9px;}
  .storyMusicFragmentSummary{align-items:flex-start;flex-direction:column;gap:3px;}
  .storyMusicFragmentSummary strong{font-size:12px;}
  .storyMusicAppliedActions{align-items:flex-start;flex-direction:column}.storyMusicAppliedActions>span{text-align:left}.storyPublishBody{padding-bottom:28px;scroll-padding-bottom:90px}.storyMusicPopularCard{grid-template-columns:104px minmax(0,1fr);min-height:136px;padding:9px}.storyMusicPopularCard>img,.storyMusicPopularCard>.storyMusicArtworkFallback{width:104px;height:104px;flex-basis:104px}.storyMusicPopularPlay{left:78px;top:83px}.storyMusicPopularAdd{right:10px;bottom:10px}
}


/* v2.17.8 media + waveform */
.mediaThumb{
  display:block;
  position:relative;
  padding:0;
  border:0;
  background:transparent;
  border-radius:20px;
  overflow:hidden;
  width:min(360px, 100%);
  cursor:pointer;
}
.mediaThumb img,
.mediaThumb video{
  display:block;
  width:100%;
  max-height:360px;
  object-fit:cover;
  border-radius:20px;
  background:rgba(0,0,0,.08);
}
.videoThumb{
  aspect-ratio:var(--video-preview-ratio,4/3);
  min-height:176px;
  background:
    radial-gradient(circle at 28% 22%,rgba(255,244,233,.42),transparent 34%),
    linear-gradient(145deg,#d9c1c7,#6f5862);
}
.videoThumb video{width:100%;height:100%;min-height:176px;background:transparent;object-fit:cover;}
video[data-video-preview]{opacity:0;transition:opacity .18s ease;}
video[data-video-preview].videoPreviewReady{opacity:1;}
.pendingMedia:has(video[data-video-preview]){aspect-ratio:var(--video-preview-ratio,4/3);background:linear-gradient(145deg,#d9c1c7,#6f5862);}
.pendingMedia:has(video[data-video-preview]) video{width:100%;height:100%;object-fit:cover;}
.mediaThumb::after{
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, transparent 55%, rgba(12,16,24,.24) 100%);
  pointer-events:none;
}
.mediaCaption,
.mediaBadge{
  position:absolute;
  z-index:2;
  color:#fff;
  text-shadow:0 2px 12px rgba(0,0,0,.55);
}
.mediaCaption{
  left:14px;
  right:14px;
  bottom:12px;
  text-align:left;
  font-size:13px;
  font-weight:600;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mediaBadge{
  left:12px;
  top:12px;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(8,12,20,.5);
  backdrop-filter:blur(8px);
  font-size:12px;
  font-weight:700;
}
.modernFile{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:min(360px,100%);
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.16);
}
.modernFile .fi{
  width:42px;
  height:42px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.22);
  font-size:20px;
  flex:0 0 auto;
}
.modernFile .fileBody{min-width:0;flex:1 1 auto;}
.modernFile .fn{font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.modernFile .fs{font-size:12px;opacity:.82;margin-top:4px;}
.modernFile .fileActions{display:flex;gap:10px;flex:0 0 auto;}
.modernFile .fileActions a{font-size:12px;font-weight:700;text-decoration:none;opacity:.9;}
.modernVoice{
  display:flex;
  align-items:center;
  gap:12px;
  width:min(380px,100%);
  padding:12px 14px;
  border-radius:18px;
  background:rgba(255,255,255,.14);
  border:1px solid rgba(255,255,255,.14);
}
.voicePlayBtn{
  width:42px;
  height:42px;
  border:0;
  border-radius:14px;
  cursor:pointer;
  font-size:16px;
  font-weight:800;
  background:rgba(30,38,52,.28);
  color:inherit;
  flex:0 0 auto;
}
.voiceMain{min-width:0;flex:1 1 auto;display:grid;gap:8px;}
.voiceWave{
  display:grid;
  grid-template-columns:repeat(38,minmax(3px,1fr));
  align-items:center;
  gap:3px;
  height:34px;
  cursor:pointer;
}
.voiceBar{
  display:block;
  width:100%;
  height:var(--voice-bar-height,14px);
  border-radius:999px;
  background:rgba(122,138,162,.34);
  transition:background .16s ease, opacity .16s ease, height .16s ease;
  opacity:.9;
}
.voiceBar.active{background:var(--accent,#4f8cff);}
.modernVoice.is-playing .voicePlayBtn{background:var(--accent,#4f8cff);color:#fff;}
.voiceMetaRow{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;}
.voiceName{min-width:0;font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.voiceTiming{font-size:12px;font-weight:700;white-space:nowrap;opacity:.86;}
.voiceTimingSep{opacity:.6;padding:0 4px;}
.viewerStage{display:flex;justify-content:center;align-items:center;min-height:40vh;max-height:72vh;}
.viewerImage,.viewerVideo{max-width:100%;max-height:72vh;border-radius:20px;background:rgba(0,0,0,.12);}
.viewerCaption{margin-top:12px;text-align:center;font-size:14px;opacity:.86;}
.mediaViewerModal{max-width:min(96vw,980px)!important;}
.mediaViewerBody{padding:14px 14px 6px;}
.bubble.mediaBubble{padding:8px;}
.bubble.mediaBubble .time{margin-top:8px;padding-right:6px;}
@media (max-width:720px){
  .modernVoice,.modernFile,.mediaThumb{width:min(100%, 320px);} 
  .voiceWave{grid-template-columns:repeat(30,minmax(3px,1fr));}
  .modernFile{align-items:flex-start;flex-wrap:wrap;}
  .modernFile .fileActions{width:100%;padding-left:54px;}
}


/* v2.17.9 media fixes */
html,body{background:var(--bg);}
.app,.sidebar,.chatMain{background:transparent;}
@supports (height: 100dvh){
  .app{min-height:100dvh;height:100dvh;}
}
body[data-theme="warm-sand"] .app,
body[data-theme="warm-sand"] .chatMain,
body[data-theme="warm-sand"] .messages,
body[data-theme="warm-sand"] .composer,
body[data-theme="warm-sand"] .header{background-color:transparent;}
.modernVoice{
  align-items:center;
}
.voiceMainSingle{display:flex;flex-direction:column;gap:8px;min-width:0;}
.voiceInlineRow{display:flex;align-items:center;gap:12px;min-width:0;width:100%;}
.voiceWave{
  display:flex;
  align-items:flex-end;
  gap:3px;
  height:28px;
  cursor:pointer;
  flex:1 1 auto;
  min-width:0;
}
.voiceBar{
  flex:1 1 0;
  min-width:4px;
  max-width:6px;
  height:var(--voice-bar-height,18px);
  background:rgba(122,138,162,.28);
}
.voiceBar.active{background:var(--accent,#4f8cff);}
.voiceTiming{flex:0 0 auto; min-width:74px; text-align:right;}
.voiceName{font-size:12px; opacity:.88;}
@media (max-width:720px){
  .modernVoice{width:min(100%, 100%); padding:12px;}
  .voiceInlineRow{gap:10px;}
  .voiceWave{height:24px; gap:2px;}
  .voiceBar{min-width:3px; max-width:5px;}
  .voiceTiming{min-width:64px; font-size:12px;}
  .voiceName{font-size:11px;}
  body, .app, .sidebar, .chatMain, .messages, .composer{overflow-x:hidden;}
  body[data-theme="warm-sand"],
  body[data-theme="warm-sand"] .app{background:linear-gradient(180deg, #f8f5ef 0%, #efe7db 100%) fixed;}
  .composer{padding-bottom:max(8px, env(safe-area-inset-bottom));}
}

/* v2.18.0 receipts + voice heard + image zoom */
.bubble .text{
  overflow-wrap:anywhere;
  word-break:break-word;
}
.bubble.incoming{
  background:rgba(255,255,255,.38)!important;
  border-color:rgba(120,145,196,.28)!important;
  color:#40362f!important;
}
.bubble.incoming .time-in{
  color:rgba(64,54,47,.78)!important;
}
.bubble.outgoing .time-out,
.bubble.outgoing .receipt{
  opacity:1;
}
.receipt.sent,.receipt.delivered{color:#2f80ff!important;}
.receipt.read{color:#1aa357!important;}
.modernVoice{--voice-accent:#2f80ff;}
.modernVoice.voice-heard{--voice-accent:#1aa357;}
.modernVoice.voice-unheard{--voice-accent:#2f80ff;}
.modernVoice .voicePlayBtn{transition:background .16s ease,color .16s ease,transform .16s ease;}
.modernVoice.is-playing .voicePlayBtn,
.modernVoice.voice-heard .voicePlayBtn{background:var(--voice-accent)!important;color:#fff;}
.modernVoice .voiceBar.active{background:var(--voice-accent)!important;}
.modernVoice.voice-heard .voiceTiming,
.modernVoice.voice-heard .voiceName{color:var(--voice-accent)!important;}
.viewerImageStage{
  position:relative;
  overflow:hidden;
  border-radius:22px;
  background:rgba(0,0,0,.08);
  touch-action:none;
  user-select:none;
}
.viewerImageStage.zoomed{cursor:grab;}
.viewerImageStage.zoomed:active{cursor:grabbing;}
.viewerImage{
  max-width:100%;
  max-height:72vh;
  transform-origin:center center;
  transition:transform .12s ease-out;
  will-change:transform;
}
.viewerZoomHint{
  margin-top:10px;
  text-align:center;
  font-size:12px;
  opacity:.72;
}
@media (max-width:720px){
  .bubble.incoming{
    background:rgba(255,255,255,.56)!important;
  }
  .viewerImage{
    max-height:64vh;
  }
  .viewerZoomHint{font-size:11px;}
}


/* v2.18.1 push + share + dnd */
.linkBtn{
  appearance:none;
  border:0;
  background:transparent;
  color:var(--accent,#4f8cff);
  font:inherit;
  font-weight:700;
  padding:0;
  cursor:pointer;
}
.fileActions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
body.drag-active::after{
  content:'Отпустите файлы, чтобы отправить';
  position:fixed;
  inset:0;
  z-index:1200;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  text-align:center;
  font-size:22px;
  font-weight:800;
  color:#fff;
  background:rgba(19,34,58,.52);
  backdrop-filter:blur(8px);
}
body[data-theme="warm-sand"].drag-active::after{
  color:#5d4b3f;
  background:rgba(246,239,229,.72);
}


/* v2.18.3 upload preview */
.uploadPreviewModal{max-width:min(96vw, 860px)!important;}
.uploadPreviewBody{display:grid;gap:16px;}
.uploadPreviewGrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;}
.uploadPreviewCard{display:grid;gap:10px;padding:14px;border-radius:20px;background:rgba(255,255,255,.62);border:1px solid rgba(133,111,84,.12);min-width:0;}
.uploadPreviewCardMedia{padding:10px;}
.uploadPreviewCardMedia img,.uploadPreviewCardMedia video{display:block;width:100%;height:200px;object-fit:cover;border-radius:16px;background:rgba(0,0,0,.06);}
.uploadPreviewMeta{display:grid;gap:4px;min-width:0;}
.uploadPreviewMeta strong{font-size:14px;line-height:1.35;color:#4f4034;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.uploadPreviewMeta span{font-size:12px;line-height:1.4;color:#7a6755;word-break:break-word;}
.uploadPreviewFileIcon{width:54px;height:54px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:rgba(125,145,246,.14);font-size:24px;}
.uploadPreviewBadge{position:absolute;left:18px;top:18px;padding:6px 10px;border-radius:999px;background:rgba(18,24,34,.54);color:#fff;font-size:12px;font-weight:700;}
.uploadPreviewCardMedia{position:relative;overflow:hidden;}
@media (max-width:720px){
  .uploadPreviewGrid{grid-template-columns:1fr;gap:12px;}
  .uploadPreviewCardMedia img,.uploadPreviewCardMedia video{height:180px;}
}

.msgLink {
  color: var(--accent, #5b8cff);
  text-decoration: underline;
  text-underline-offset: 2px;
  word-break: break-word;
}

.linkPreviewShell {
  margin-top: 10px;
  border: 1px solid rgba(120,140,180,.22);
  border-radius: 18px;
  overflow: hidden;
  background: rgba(255,255,255,.55);
  min-height: 84px;
}

.linkPreviewShell.loading::before {
  content: '';
  display: block;
  height: 84px;
  background: linear-gradient(90deg, rgba(255,255,255,.15), rgba(255,255,255,.45), rgba(255,255,255,.15));
  background-size: 200% 100%;
  animation: linkPreviewShimmer 1.2s linear infinite;
}

@keyframes linkPreviewShimmer {
  from { background-position: 200% 0; }
  to { background-position: -200% 0; }
}

.linkPreviewCard {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  text-decoration: none;
  color: inherit;
}

.linkPreviewMedia {
  border-bottom: 1px solid rgba(120,140,180,.18);
  background: rgba(0,0,0,.03);
}

.linkPreviewMedia img {
  display: block;
  width: 100%;
  max-height: 220px;
  object-fit: cover;
}

.linkPreviewMeta {
  padding: 12px 14px;
}

.linkPreviewHost {
  font-size: 12px;
  opacity: .72;
  margin-bottom: 4px;
}

.linkPreviewTitle {
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25;
}

.linkPreviewDesc {
  margin-top: 6px;
  font-size: 13px;
  line-height: 1.35;
  opacity: .82;
}

.bubble.outgoing .linkPreviewShell {
  background: rgba(255,255,255,.42);
}

.bubble.incoming .linkPreviewShell {
  background: rgba(255,255,255,.82);
}


/* v2.18.6 modal actions + ios save polish */
.appModal .modal-actions .btn,
.appModal .modal-actions .btn.primary,
.appModal .modal-actions .btn-secondary{
  min-height:52px;
  padding:12px 18px;
  border-radius:16px;
  font-size:17px;
  font-weight:800;
  color:#5a4738;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(133,111,84,.16);
}
.appModal .modal-actions .btn.primary{
  color:#244a8f;
  background:rgba(125,145,246,.18);
  border-color:rgba(125,145,246,.34);
}
.appModal .modal-actions .btn:disabled,
.appModal .modal-actions .btn.primary:disabled{
  opacity:.55;
}

/* DiValis 2.19 — unified warm pastel interface */
:root{
  --bg:#f8f1ed;
  --panel:#fffaf8;
  --panel2:#f5e8e4;
  --border:rgba(122,64,85,.13);
  --text:#4d3b40;
  --muted:#8b7379;
  --muted2:#a38b90;
  --accent:#b65f7b;
  --danger:#b84f63;
  --ok:#68866f;
  --shadow:0 16px 42px rgba(112,70,80,.12);
  --bubble-in-bg:#fffaf8;
  --bubble-in-border:rgba(122,64,85,.11);
  --bubble-in-text:#4d3b40;
  --bubble-in-time:#9a8086;
  --bubble-out-bg-start:#f3c5d2;
  --bubble-out-bg-end:#e9afc0;
  --bubble-out-border:rgba(143,67,91,.14);
  --bubble-out-text:#573d47;
  --bubble-out-time:rgba(87,61,71,.68);
  --bubble-glow-opacity:0;
}

body,
body[data-theme="divalis"],
body[data-theme="midnight"],
body[data-theme="warm-sand"]{
  color:var(--text);
  background:
    radial-gradient(900px 620px at 8% -5%,rgba(237,190,201,.4),transparent 62%),
    radial-gradient(800px 620px at 100% 100%,rgba(226,203,180,.32),transparent 60%),
    linear-gradient(145deg,#fbf5f1 0%,#f1e3df 100%) fixed;
}

.app{background:transparent;}
.sidebar{
  width:350px;
  background:rgba(255,250,248,.82)!important;
  border-right:1px solid var(--border);
  box-shadow:12px 0 34px rgba(112,70,80,.05);
  backdrop-filter:blur(22px);
}
.topbar{min-height:72px;padding:13px 16px 10px;position:relative;}
.brand{gap:10px;font-family:Georgia,"Times New Roman",serif;font-size:23px;font-weight:600;letter-spacing:.8px;color:#82405d;}
.brandLogo{width:42px;height:42px;border-radius:14px;object-fit:cover;box-shadow:0 8px 22px rgba(122,64,85,.15);}
.topbarActions{margin-left:auto;display:flex;gap:7px;}
.profileBtn{margin-left:auto;min-width:0;max-width:128px;border:0;background:transparent;color:var(--text);padding:5px 7px;border-radius:13px;cursor:pointer;display:flex;align-items:center;gap:7px;}
.profileBtn:hover{background:rgba(231,190,199,.25);}.profileBtn #meName{font-size:12px;font-weight:750;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.topbarActions{margin-left:0;}
.sessionIdentity{display:grid;gap:2px;padding:7px 11px 10px;margin-bottom:5px;border-bottom:1px solid var(--border);color:var(--muted);font-size:11px;}
.sessionIdentity strong{color:#82405d;font-size:13px;letter-spacing:.15px;}

.search{padding:5px 14px 12px;background:transparent!important;position:relative;top:auto!important;bottom:auto!important;z-index:20;}
.search input,
input,
textarea,
select{
  color:var(--text)!important;
  background:rgba(255,255,255,.7)!important;
  border-color:var(--border)!important;
}
.search input{padding:12px 54px 12px 15px;border-radius:16px;}
.searchComposeBtn{position:absolute;right:20px;top:12px;width:34px;height:34px;border:0;border-radius:12px;display:grid;place-items:center;padding:0;color:#fff;background:linear-gradient(135deg,#b85f7c,#d98fa4);box-shadow:0 6px 16px rgba(182,95,123,.2);cursor:pointer;}
.searchComposeBtn .uiIcon{width:18px;height:18px;}
.search > .composeMenu{top:46px;right:14px;min-width:190px;z-index:80;}
.search input:focus,input:focus,textarea:focus,select:focus{outline:none;border-color:rgba(182,95,123,.48)!important;box-shadow:0 0 0 4px rgba(182,95,123,.09);}

.conversationScopes{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:0 14px 7px;padding:4px;border:1px solid rgba(182,95,123,.12);border-radius:15px;background:rgba(255,250,248,.55);}
.conversationScope{min-height:34px;border:0;border-radius:11px;background:transparent;color:#8b6571;font:inherit;font-size:12px;font-weight:750;cursor:pointer;transition:background .16s ease,color .16s ease,box-shadow .16s ease;}
.conversationScope.active{color:#7e3d58;background:#fffaf8;box-shadow:0 4px 13px rgba(122,64,85,.09);}
.conversationScope span:not(:empty){display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:4px;padding:0 5px;border-radius:999px;background:#c96582;color:#fff;font-size:10px;}

.sidebarSection{padding:2px 16px 5px;}
.sidebarLabel{color:#8a5b69;font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;}
.sidebarMeta{color:var(--muted2);font-size:12px;}
.actions{padding:8px 14px 12px;}
.list{padding:4px 8px 12px;}
.item{margin:2px 0;padding:11px 10px;border:1px solid transparent;border-radius:17px;transition:background .16s ease,border-color .16s ease,transform .16s ease;}
.item:hover{background:rgba(241,219,224,.48);}
.item.active{background:linear-gradient(135deg,rgba(231,181,194,.66),rgba(244,218,220,.74))!important;border-color:rgba(182,95,123,.13)!important;box-shadow:0 8px 20px rgba(122,64,85,.08);}
.conversationSwipeRow{position:relative;min-height:72px;margin:2px 0;border-radius:17px;overflow:hidden;isolation:isolate;}
.conversationSwipeRow > .item{position:relative;z-index:2;margin:0;background:#fffaf8;touch-action:pan-y;will-change:transform;}
.conversationSwipeRow > .item.active{background:linear-gradient(135deg,#edcbd4,#f4dcdd)!important;}
.conversationSwipeRow.swipe-open > .item{transform:translateX(-310px)!important;}
.conversationSwipeActions{position:absolute;z-index:1;top:0;right:0;bottom:0;width:310px;display:grid;grid-template-columns:repeat(5,1fr);overflow:hidden;border-radius:0 17px 17px 0;}
.conversationSwipeAction{border:0;padding:7px 3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:#fff;font:inherit;font-size:10px;font-weight:750;cursor:pointer;}
.conversationSwipeAction .uiIcon{width:18px;height:18px;}
.conversationSwipeAction.pin{background:#806a91;}
.conversationSwipeAction.archive{background:#8f819c;}
.conversationSwipeAction.mute{background:#9d7790;}
.conversationSwipeAction.clear{background:#c58a69;}
.conversationSwipeAction.delete{background:#b95068;}
.conversationSwipeAction:active{filter:brightness(.94);}
.confirmChatAction{display:grid;gap:8px;text-align:center;padding:7px 2px 2px;}
.confirmChatAction strong{font-size:17px;color:var(--text);}
.confirmChatAction p{margin:0;color:var(--muted);line-height:1.5;}
.itemAside{display:flex;align-items:center;gap:6px;}
.itemMuteIcon{width:15px!important;height:15px!important;color:#9b7287;}
.itemPinIcon{width:14px!important;height:14px!important;margin-right:5px;color:#9b5873;vertical-align:-2px;}
.draftLabel{color:#bd5f7d;font-weight:800;}
.messages.history-loading::before{content:"Загружаем ранние сообщения…";position:sticky;top:8px;align-self:center;z-index:8;padding:6px 11px;border:1px solid rgba(182,95,123,.14);border-radius:999px;background:rgba(255,250,248,.9);color:#8a6570;font-size:11px;box-shadow:0 5px 14px rgba(122,64,85,.08);}
.receipt.sending{font-size:10px;color:#967681;white-space:nowrap;}
.receiptRetry{border:0;background:transparent;color:#b44768;padding:0;font:inherit;font-size:10px;font-weight:800;cursor:pointer;white-space:nowrap;}
.avatar{background:linear-gradient(145deg,#f3dce1,#ead2ca);border-color:rgba(122,64,85,.1);color:#8a4562;}
.name{color:var(--text);font-weight:750;}.sub,.badge{color:var(--muted);}

.btn{
  color:var(--text)!important;
  background:rgba(255,250,248,.76)!important;
  border-color:var(--border)!important;
  border-radius:14px;
  box-shadow:none;
}
.btn:hover{background:#fffaf8!important;border-color:rgba(182,95,123,.24)!important;}
.btn.primary,
body[data-theme="warm-sand"] .btn.primary{
  color:#fff!important;
  background:linear-gradient(135deg,#b85f7c,#d98fa4)!important;
  border-color:transparent!important;
  box-shadow:0 8px 20px rgba(182,95,123,.2);
}
.btn.danger,.menuItem.danger{color:var(--danger)!important;background:rgba(184,79,99,.07)!important;}
.icon-btn{color:#765560!important;}

.header{
  height:68px;
  padding:10px 18px;
  background:rgba(255,250,248,.78)!important;
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(22px);
}
.peer .title{color:var(--text);font-size:16px;}.peerSubtitle,.presenceText,.peer .hint{color:var(--muted);}
.lock.ok{color:#6b7f6f;background:rgba(104,134,111,.09);border-color:rgba(104,134,111,.18);}

.main{background:rgba(255,250,248,.2);}
.messages{padding:20px 18px 14px;background-image:radial-gradient(rgba(182,95,123,.055) 1px,transparent 1px);background-size:22px 22px;}
.bubble{border-radius:19px;box-shadow:0 7px 18px rgba(112,70,80,.07);}
.bubble.incoming{background:var(--bubble-in-bg)!important;border-color:var(--bubble-in-border)!important;color:var(--bubble-in-text)!important;border-bottom-left-radius:7px;}
.bubble.outgoing{background:linear-gradient(135deg,var(--bubble-out-bg-start),var(--bubble-out-bg-end))!important;border-color:var(--bubble-out-border)!important;color:var(--bubble-out-text)!important;border-bottom-right-radius:7px;}
.bubble.outgoing .time,.bubble.outgoing .msgTime{color:var(--bubble-out-time)!important;}
.msgLink{color:#9c4467;}.bubble.outgoing .msgLink{color:#fff;text-decoration-color:rgba(255,255,255,.6);}

.composer{padding:10px 14px max(12px,env(safe-area-inset-bottom));background:rgba(255,250,248,.86)!important;border-top:1px solid var(--border);backdrop-filter:blur(22px);}
.composerRow{gap:8px;align-items:flex-end;}
.composer textarea{min-height:44px;padding:11px 14px;border-radius:18px!important;background:#fffdfb!important;}
.composer .icon-btn{width:44px;height:44px;border-radius:15px;}
.composer #send{min-height:44px;border-radius:15px;}

.empty{padding:24px;}.emptyHero{max-width:780px;}
.emptyBadge{color:#9c4d6b!important;background:rgba(232,190,200,.46)!important;border-color:rgba(182,95,123,.12)!important;}
.emptyHero h2{font-family:Georgia,"Times New Roman",serif;color:#6d3d4e;font-weight:600;letter-spacing:.2px;}
.emptyHero p{color:var(--muted);}
.emptyMiniCard,.statebox{background:rgba(255,250,248,.72)!important;border-color:var(--border)!important;border-radius:22px!important;box-shadow:0 14px 34px rgba(112,70,80,.07);}

.composeMenu,.topbarMenu,.contextMenu{
  background:rgba(255,250,248,.98)!important;
  border-color:var(--border)!important;
  border-radius:17px!important;
  box-shadow:var(--shadow)!important;
}
.menuItem{color:var(--text)!important;border-radius:11px;}.menuItem:hover{background:rgba(231,190,199,.28)!important;}

.modal-overlay{background:rgba(76,49,57,.28)!important;backdrop-filter:blur(7px);}
.modal,.appModal,.modal-card{
  color:var(--text)!important;
  background:rgba(255,250,248,.97)!important;
  border-color:rgba(255,255,255,.8)!important;
  border-radius:25px!important;
  box-shadow:0 28px 80px rgba(85,48,59,.22)!important;
}
.modal-header,.modal-actions{border-color:var(--border)!important;}
.modal-title{color:#6f4051;}.hint{color:var(--muted)!important;}
.appModal .modal-actions .btn,.appModal .modal-actions .btn.primary,.appModal .modal-actions .btn-secondary{color:var(--text);background:#fff8f6;border-color:var(--border);}
.appModal .modal-actions .btn.primary{color:#fff;background:linear-gradient(135deg,#b85f7c,#d98fa4);border-color:transparent;}

.drawer{background:#fffaf8!important;border-color:var(--border)!important;box-shadow:-18px 0 46px rgba(112,70,80,.12);}
.drawerHeader,.tabs{border-color:var(--border)!important;}.tab{color:var(--muted)!important;}.tab.active{color:#a34e6d!important;background:rgba(231,190,199,.3)!important;}
.fab,.newmsgs,body[data-theme="warm-sand"] .fab{background:linear-gradient(135deg,#b85f7c,#d98fa4)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 12px 28px rgba(182,95,123,.24);}
.toast{background:#6f4452!important;color:#fff!important;border-color:rgba(255,255,255,.18)!important;}
.recCard,.uploadPreviewCard,.linkPreviewShell{background:rgba(255,250,248,.96)!important;border-color:var(--border)!important;}

*{scrollbar-color:rgba(182,95,123,.28) transparent;scrollbar-width:thin;}
*::-webkit-scrollbar{width:7px;height:7px}*::-webkit-scrollbar-thumb{background:rgba(182,95,123,.25);border-radius:20px}*::-webkit-scrollbar-track{background:transparent}

@media (max-width:720px){
  .sidebar{width:100%;max-width:none;}
  .topbar{min-height:66px;padding-top:max(10px,calc(env(safe-area-inset-top) + 8px));}
  .brandLogo{width:38px;height:38px;border-radius:13px}.brand{font-size:21px}
  .profileBtn{max-width:92px;padding-left:4px;padding-right:4px}.profileBtn .avatar{display:none;}.profileBtn #meName{font-size:11px;}
  .header{height:64px;padding:8px 12px;}
  .messages{padding:14px 10px 10px;}
  .bubble{max-width:88%;}
  .composer{padding-left:8px;padding-right:8px;}
  .composer #send{font-size:0;width:44px;padding:0;}
  .composer #send::after{content:'➤';font-size:18px;}
  .empty{padding:16px;}
}

/* DiValis 2.19.1 — SVG icon system and iPhone viewport fixes */
.iconSprite{position:absolute!important;width:0!important;height:0!important;overflow:hidden!important;pointer-events:none!important;}
.uiIcon{width:20px;height:20px;display:inline-block;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:middle;}
.btn.small .uiIcon,.icon-btn .uiIcon{width:19px;height:19px;}
.menuItem{display:flex;align-items:center;gap:10px;}
.menuItem .uiIcon{width:18px;height:18px;color:#9b5570;}
.lock{padding:8px;width:38px;height:38px;justify-content:center;}
.lock .uiIcon{width:17px;height:17px;}
.voicePlayBtn .uiIcon{width:22px;height:22px;}
.voiceName{display:flex;align-items:center;gap:6px;}.voiceName .uiIcon{width:15px;height:15px;}
.fi .uiIcon,.peerFileIcon .uiIcon,.uploadPreviewFileIcon .uiIcon{width:26px;height:26px;color:#a65070;}
.mediaBadge,.uploadPreviewBadge{display:inline-flex;align-items:center;gap:5px;}.mediaBadge .uiIcon,.uploadPreviewBadge .uiIcon{width:13px;height:13px;}
.sendIcon{display:none;}
#send::after{content:none!important;display:none!important;}

@media (max-width:720px){
  html,body{width:100%;height:100%;height:100dvh;min-height:0!important;overflow:hidden!important;overscroll-behavior:none;}
  body{position:relative;}
  .app{
    display:flex!important;
    position:relative!important;
    width:100%!important;
    height:100dvh!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  .sidebar,.main{
    width:100%!important;
    min-width:100%!important;
    max-width:100%!important;
    height:100dvh!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  .sidebar{display:flex!important;}
  .main{display:none!important;grid-template-rows:auto minmax(0,1fr) auto;}
  .app.mobile-chat .sidebar{display:none!important;}
  .app.mobile-chat .main{display:grid!important;}
  .header{
    position:relative!important;
    inset:auto!important;
    flex:0 0 auto!important;
    min-height:0!important;
    height:auto!important;
    padding:max(8px,env(safe-area-inset-top)) 10px 8px!important;
    align-items:center!important;
    overscroll-behavior:none;
  }
  .peer{align-items:center!important;gap:10px;}.peerMeta{padding-top:0;}
  .messages{
    min-height:0!important;
    height:auto!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch;
  }
  .composer{
    position:relative!important;
    inset:auto!important;
    flex:0 0 auto!important;
    min-height:0!important;
    padding:4px 7px max(6px,env(safe-area-inset-bottom))!important;
    overscroll-behavior:none;
  }
  .composerRow{gap:6px!important;align-items:center!important;}
  .composer .icon-btn,.composer #send{width:40px!important;height:40px!important;min-height:40px!important;border-radius:14px!important;padding:0!important;}
  .composer #send{width:36px!important;height:36px!important;min-height:36px!important;border-radius:13px!important;}
  .composer textarea{height:40px;min-height:40px!important;max-height:108px!important;padding:9px 12px!important;border-radius:15px!important;}
  .composer #send{font-size:inherit!important;}
  .sendLabel{display:none!important;}.sendIcon{display:inline-block!important;width:19px;height:19px;}
  .modal-overlay{
    align-items:center!important;
    justify-content:center!important;
    padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))!important;
    overflow:hidden!important;
  }
  .modal{margin:auto!important;max-height:calc(100dvh - max(24px,env(safe-area-inset-top)) - max(24px,env(safe-area-inset-bottom)))!important;}
}

/* DiValis 2.19.2 — compact iMessage-inspired composer */
.composerRow{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:8px;
  align-items:end;
}
.messageCapsule{
  min-width:0;
  min-height:44px;
  display:flex;
  align-items:flex-end;
  gap:2px;
  padding:2px 3px 2px 14px;
  border:1px solid rgba(137,83,101,.18);
  border-radius:23px;
  background:rgba(255,253,251,.94);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 5px 16px rgba(112,70,80,.055);
  transition:border-color .16s ease,box-shadow .16s ease,background .16s ease;
}
.messageCapsule:focus-within{
  border-color:rgba(182,95,123,.38);
  background:#fff;
  box-shadow:0 0 0 3px rgba(216,143,164,.11),0 6px 18px rgba(112,70,80,.07);
}
.messageCapsule #text,
.messageCapsule textarea{
  flex:1;
  width:100%;
  min-width:0;
  min-height:38px;
  max-height:120px;
  margin:0;
  padding:9px 2px 8px 0;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  line-height:20px;
}
.messageCapsule textarea:focus{outline:none;}
.capsuleAction{
  flex:0 0 auto;
  width:38px;
  height:38px;
  min-width:38px;
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin:1px;
  padding:0;
  border:0;
  border-radius:50%;
  color:#956078;
  background:transparent;
  cursor:pointer;
  transition:background .16s ease,color .16s ease,transform .12s ease,opacity .16s ease;
}
.capsuleAction:hover{background:rgba(229,190,200,.28);color:#a34e6d;}
.capsuleAction:active{transform:scale(.92);}
.capsuleAction.recording{color:#fff;background:#bc596f;}
.composer .attach{
  width:40px!important;
  height:40px!important;
  min-width:40px!important;
  min-height:40px!important;
  align-self:end;
  margin-bottom:2px;
  border-radius:50%!important;
  color:#a05270!important;
  background:rgba(237,205,211,.52)!important;
}
.composer #send{
  width:40px;
  height:40px;
  min-width:40px;
  min-height:40px;
  align-self:end;
  margin-bottom:2px;
  padding:0;
  border-radius:50%;
  opacity:0;
  transform:scale(.72);
  pointer-events:none;
  transition:opacity .16s ease,transform .16s cubic-bezier(.2,.9,.25,1.2);
}
.composer.has-text #send{opacity:1;transform:scale(1);pointer-events:auto;}
.composer.has-text .capsuleAction.mic{opacity:.38;}

@media (max-width:720px){
  .composer{padding:5px 8px max(7px,env(safe-area-inset-bottom))!important;}
  .composerRow{gap:6px!important;align-items:end!important;}
  .messageCapsule{min-height:40px;border-radius:21px;padding-left:12px;}
  .messageCapsule #text,
  .messageCapsule textarea{
    height:36px;
    min-height:36px!important;
    max-height:104px!important;
    padding:8px 2px 8px 0!important;
    border-radius:0!important;
  }
  .capsuleAction{width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;margin:2px;}
  .capsuleAction .uiIcon{width:18px;height:18px;}
  .composer .attach{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;}
  .composer #send{width:36px!important;height:36px!important;min-width:36px!important;min-height:36px!important;border-radius:50%!important;}
  .composer:not(.has-text) #send{display:none!important;}
}

/* DiValis 2.19.3 — truthful security state */
button.lock{
  appearance:none;
  font:inherit;
  cursor:pointer;
}
button.lock.open{
  color:#a66d3f;
  background:rgba(236,194,147,.18);
  border-color:rgba(180,116,64,.2);
}
button.lock.open:hover{background:rgba(236,194,147,.28);}
button.lock.changed{color:#a5485a;background:rgba(184,79,99,.12);border-color:rgba(184,79,99,.24);}
.securityStatusCard{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;align-items:start;}
.securityStatusIcon{
  width:46px;height:46px;border-radius:15px;display:flex;align-items:center;justify-content:center;
  color:#a66d3f;background:rgba(236,194,147,.22);border:1px solid rgba(180,116,64,.16);
}
.securityStatusIcon .uiIcon{width:23px;height:23px;}
.securityStatusIcon.ready{color:#617e68;background:rgba(104,134,111,.13);border-color:rgba(104,134,111,.2);}
.securityStatusTitle{font-weight:800;color:#704558;margin:2px 0 8px;}
.securityStatusCard p{margin:0 0 10px;line-height:1.5;color:var(--muted);}
.fingerprintLabel{margin:10px 0 5px;color:var(--muted);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;}
.fingerprintValue{display:block;padding:9px 10px;border-radius:12px;background:rgba(227,193,201,.18);color:#704558;font-size:10px;line-height:1.55;word-break:break-all;white-space:normal;}
.securityCaveat{margin-top:12px!important;font-size:12px;}
.messageE2ee{display:inline-flex;align-items:center;margin-right:4px;vertical-align:-2px;opacity:.72;}
.messageE2ee[data-open-security]{cursor:pointer;touch-action:manipulation;}
.messageE2ee .uiIcon{width:11px;height:11px;}
.decryptErrorBubble .text{font-style:italic;opacity:.75;}
.securityStatusCard.recover{padding:2px 2px 15px;border-bottom:1px solid rgba(177,101,124,.13);}
.securityStatusCard.recover .securityStatusTitle{font-size:17px;line-height:1.3;}
.securityStatusCard.recover p{font-size:13px;line-height:1.48;margin-bottom:0;}
.e2eeUnlockForm{display:grid;gap:8px;padding:17px 2px 2px;}
.e2eeUnlockForm label{font-size:12px;font-weight:800;color:#79505f;}
.e2eeUnlockField{position:relative;display:flex;align-items:center;}
.e2eeUnlockField .input{width:100%;min-height:49px;padding-right:50px;font-size:16px;border-radius:15px;background:rgba(255,251,244,.9);}
.e2eePasswordToggle{position:absolute;right:5px;width:40px;height:40px;padding:0;border:0;border-radius:12px;display:grid;place-items:center;color:#9a6a78;background:transparent;cursor:pointer;}
.e2eePasswordToggle:active{background:rgba(188,91,123,.1);transform:scale(.95);}
.e2eePasswordToggle .uiIcon{width:19px;height:19px;}
.e2eeUnlockStatus{min-height:18px;font-size:12px;line-height:1.4;color:#9a6a78;}
.e2eeUnlockStatus.loading{color:#8f6874;}
.e2eeUnlockStatus.error{color:#b43e56;font-weight:700;}

/* DiValis 2.20.1 — mobile header, audio controls and compact E2EE status */
button.lock.ok{
  color:#247a49!important;
  background:rgba(48,157,92,.14)!important;
  border-color:rgba(37,132,78,.25)!important;
}
button.lock.open,
button.lock.changed{
  color:#bd4055!important;
  background:rgba(201,62,85,.12)!important;
  border-color:rgba(184,55,77,.23)!important;
}

.messageCancelling{
  position:relative;
  z-index:2;
  animation:messageCancellationPop .68s cubic-bezier(.18,.78,.24,1) both;
  transform-origin:center;
}
.messageCancellationBurst{
  position:fixed;
  z-index:2600;
  width:1px;height:1px;
  pointer-events:none;
}
.cancellationPopper{
  position:absolute;
  left:-7px;top:-3px;
  width:14px;height:24px;
  border-radius:3px 3px 9px 9px;
  background:linear-gradient(135deg,#f1c36d 0 30%,#df7890 31% 58%,#8eb9ca 59% 100%);
  transform-origin:50% 100%;
  animation:cancellationPopperBurst .62s cubic-bezier(.2,.75,.25,1) both;
}
.cancellationConfetti{
  position:absolute;
  left:-3px;top:-3px;
  width:6px;height:9px;
  border-radius:2px;
  background:var(--confetti-color);
  opacity:0;
  animation:cancellationConfettiFly .64s cubic-bezier(.12,.66,.28,1) var(--confetti-delay) both;
}
@keyframes messageCancellationPop{
  0%{transform:scale(1);opacity:1;filter:none;}
  30%{transform:scale(1.07) rotate(-1deg);opacity:1;}
  62%{transform:scale(.82) rotate(2deg);opacity:.88;filter:saturate(1.2);}
  100%{transform:scale(.12);opacity:0;filter:blur(2px);}
}
@keyframes cancellationPopperBurst{
  0%{transform:translate(-2px,6px) rotate(-38deg) scale(.3);opacity:0;}
  20%{transform:translate(-2px,6px) rotate(-38deg) scale(1);opacity:1;}
  72%{transform:translate(-8px,16px) rotate(-48deg) scale(.92);opacity:1;}
  100%{transform:translate(-10px,22px) rotate(-55deg) scale(.7);opacity:0;}
}
@keyframes cancellationConfettiFly{
  0%{transform:translate(0,0) rotate(0);opacity:0;}
  12%{opacity:1;}
  74%{opacity:1;}
  100%{transform:translate(var(--confetti-x),var(--confetti-y)) rotate(var(--confetti-r));opacity:0;}
}
@media (prefers-reduced-motion:reduce){
  .messageCancelling{animation:messageCancellationFade .22s ease both;}
  .messageCancellationBurst{display:none;}
  @keyframes messageCancellationFade{to{opacity:0;}}
}
.securityStatusCard.compact{grid-template-columns:auto minmax(0,1fr);align-items:center;padding:8px 2px;}
.securityStatusCard.compact .securityStatusTitle{margin:0;font-size:16px;line-height:1.35;}
.voicePlayBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  line-height:1;
}
.voicePlayBtn .uiIcon{display:block;margin:0;transform:translateX(-1px);}

@media (max-width:720px){
  body::before{
    content:"";
    position:fixed;
    top:0;
    left:0;
    right:0;
    height:env(safe-area-inset-top);
    z-index:2200;
    pointer-events:none;
    background:#d9c1c3;
  }
  body.photo-viewer-open::before{background:#000;}
  .header{
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr) 40px!important;
    column-gap:7px!important;
  }
  .header > #btnBack{grid-column:1;grid-row:1;width:40px;height:40px;min-width:40px;padding:0;border-radius:14px;}
  .header > .peer{grid-column:2;grid-row:1;justify-content:center!important;min-width:0;text-align:center;position:relative;}
  .header > .peer #peerAvatar{position:absolute;left:0;top:50%;transform:translateY(-50%);}
  .header > .peer .peerMeta{width:100%;min-width:0;padding:0 40px;text-align:center;}
  .header > .peer .peerSubline{justify-content:center;}
  .header > .peer .title{display:block;width:100%;text-align:center;}
  .header > .right{grid-column:3;grid-row:1;justify-content:flex-end;gap:0;}
  .header > .right .lock{width:40px;height:40px;}
  .main{touch-action:pan-y;overscroll-behavior-x:none;}
  .composer{padding-bottom:max(2px,calc(env(safe-area-inset-bottom) - 16px))!important;}
}

/* DiValis 2.20.5 — useful two-pane landscape layout */
@media (orientation:landscape) and (max-height:500px) and (min-width:721px){
  .sidebar > .actions{display:none!important;}
  .header{
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr) 40px!important;
    column-gap:7px!important;
    padding:8px 10px!important;
    align-items:center!important;
  }
  .header > #btnBack{display:none!important;}
  .header > .peer{grid-column:2;grid-row:1;justify-content:center!important;min-width:0;text-align:center;position:relative;}
  .header > .peer #peerAvatar{position:absolute;left:0;top:50%;transform:translateY(-50%);}
  .header > .peer .peerMeta{width:100%;min-width:0;padding:0 40px;text-align:center;}
  .header > .peer .peerSubline{justify-content:center;}
  .header > .peer .title{display:block;width:100%;text-align:center;}
  .header > .right{grid-column:3;grid-row:1;justify-content:flex-end;gap:0;}
  .header > .right .lock{width:40px;height:40px;}
}

/* DiValis 2.21.0 — WebRTC calls and compact security indicator */
.main{position:relative;}
.headerCallBtn{
  appearance:none;
  width:40px;
  height:40px;
  min-width:40px;
  padding:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#9e536f;
  background:rgba(255,250,248,.78);
  border:1px solid rgba(182,95,123,.16);
  border-radius:14px;
  cursor:pointer;
  transition:transform .16s ease,background .16s ease,border-color .16s ease;
}
.headerCallBtn:hover{background:#fffaf8;border-color:rgba(182,95,123,.3);transform:translateY(-1px);}
.headerCallBtn:active{transform:scale(.95);}
.headerCallBtn:disabled{opacity:.32;pointer-events:none;}
.headerCallBtn .uiIcon{width:19px;height:19px;}
.securityDock{
  position:absolute;
  z-index:8;
  top:74px;
  right:12px;
  pointer-events:none;
}
.securityDock .lock{
  pointer-events:auto;
  width:27px!important;
  height:27px!important;
  min-width:27px!important;
  padding:0!important;
  border-radius:10px!important;
  box-shadow:0 4px 14px rgba(96,57,68,.08);
  backdrop-filter:blur(14px);
}
.securityDock .lock .uiIcon{width:13px;height:13px;}

.callOverlay{
  position:fixed;
  inset:0;
  z-index:1000;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  background:#634251;
  isolation:isolate;
}
.callOverlay.hidden{display:none!important;}
.callBackdrop{
  position:absolute;inset:-30px;z-index:-3;
  background:
    radial-gradient(circle at 25% 20%,rgba(239,189,201,.72),transparent 34%),
    radial-gradient(circle at 78% 68%,rgba(178,94,126,.65),transparent 42%),
    linear-gradient(145deg,#8e5b70,#3d3039);
  filter:saturate(.85);
}
.remoteVideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:0;transition:opacity .3s ease;background:#291e24;}
.callOverlay.videoMode.hasRemoteVideo .remoteVideo{opacity:1;}
.callShade{position:absolute;inset:0;z-index:-1;background:linear-gradient(to bottom,rgba(28,18,24,.42),transparent 35%,transparent 56%,rgba(28,18,24,.68));}
.localVideo{
  position:absolute;top:max(16px,env(safe-area-inset-top));right:16px;
  width:min(28vw,150px);aspect-ratio:3/4;object-fit:cover;
  border:1px solid rgba(255,255,255,.45);border-radius:20px;background:#3f3037;
  box-shadow:0 15px 40px rgba(24,13,18,.32);z-index:2;
  opacity:0;
  visibility:hidden;
  transition:opacity .2s ease;
}
.callOverlay.videoMode.hasLocalVideo .localVideo{display:block!important;opacity:1;visibility:visible;}
.callIdentity{display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:-12vh;padding:20px;}
.callAvatar{width:112px;height:112px;border-radius:38px;overflow:hidden;display:flex;align-items:center;justify-content:center;background:rgba(255,245,242,.93);color:#a85573;border:1px solid rgba(255,255,255,.68);box-shadow:0 22px 55px rgba(25,12,18,.25);font-family:Georgia,serif;font-size:42px;}
.callAvatar img{width:100%;height:100%;object-fit:cover;}
.callAvatar .uiIcon{width:44px;height:44px;}
.callPeer{margin-top:18px;font-size:27px;font-weight:750;letter-spacing:.01em;text-shadow:0 2px 14px rgba(0,0,0,.24);}
.callStatus{margin-top:7px;font-size:14px;color:rgba(255,255,255,.8);}
.callTimer{margin-top:5px;font-size:13px;font-variant-numeric:tabular-nums;color:rgba(255,255,255,.86);}
.callOverlay.videoMode.connected .callIdentity{
  position:absolute;
  top:max(16px,env(safe-area-inset-top));
  left:16px;
  margin:0;
  padding:0;
  align-items:flex-start;
  pointer-events:none;
}
.callOverlay.videoMode.connected .callAvatar,
.callOverlay.videoMode.connected .callPeer,
.callOverlay.videoMode.connected .callStatus{display:none;}
.callOverlay.videoMode.connected .callTimer{
  margin:0;
  padding:6px 10px;
  border-radius:999px;
  color:#fff;
  background:rgba(32,22,27,.38);
  box-shadow:0 6px 20px rgba(20,12,16,.16);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.callControls{
  position:absolute;left:0;right:0;bottom:max(24px,calc(env(safe-area-inset-bottom) + 14px));
  display:flex;justify-content:center;align-items:flex-start;gap:18px;padding:0 18px;
}
.callControl{
  appearance:none;border:0;background:rgba(255,255,255,.18);color:#fff;
  width:64px;min-width:64px;height:64px;border-radius:24px;padding:0;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  box-shadow:0 10px 28px rgba(25,12,18,.22);backdrop-filter:blur(18px);
  position:relative;
}
.callControl .uiIcon{width:25px;height:25px;}
.callControl span{position:absolute;top:70px;left:50%;transform:translateX(-50%);font-size:11px;white-space:nowrap;color:rgba(255,255,255,.82);}
.callControl.off{background:rgba(36,25,31,.62);}
.callControl.accept{background:#43a86b;}
.callControl.hangup{background:#d84b62;}
.callControl:active{transform:scale(.94);}
.callControl:disabled{opacity:.48;cursor:wait;transform:none;}

/* DiValis 2.34.11 - live recommendations and iOS media controls. */
.musicNowActions{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.storyMusicBadge{font:inherit;text-align:left;cursor:pointer;-webkit-appearance:none;appearance:none}
.storyMusicBadge:active{transform:translateX(-50%) scale(.97)}
.musicSharePreview{display:grid;grid-template-columns:54px minmax(0,1fr);gap:12px;align-items:center;margin-bottom:14px;padding:12px;border-radius:18px;background:linear-gradient(135deg,rgba(207,86,126,.14),rgba(255,242,225,.72));border:1px solid rgba(128,67,88,.1)}
.musicSharePreview .musicTrackArt{width:54px;height:54px;border-radius:15px}.musicSharePreview>span:last-child{min-width:0;display:grid;gap:4px}.musicSharePreview strong,.musicSharePreview small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicSharePreview small{color:var(--muted)}
.musicShareSystem{width:100%;min-height:48px;margin:2px 0 12px;border:1px solid rgba(128,67,88,.12);border-radius:16px;display:flex;align-items:center;justify-content:center;gap:9px;background:rgba(255,255,255,.68);color:var(--text);font:inherit;font-weight:750}.musicShareSystem .uiIcon{width:18px;height:18px}

@media (max-width:720px){
  .header{grid-template-columns:40px minmax(0,1fr) 86px!important;}
  .header > .right{grid-column:3;gap:6px!important;}
  .headerCallBtn{width:40px;height:40px;min-width:40px;border-radius:14px;}
  .securityDock{top:calc(env(safe-area-inset-top) + 60px);right:8px;}
  .callIdentity{margin-top:-15vh;}
  .callAvatar{width:96px;height:96px;border-radius:32px;font-size:36px;}
  .callPeer{font-size:24px;}
  .callControls{gap:14px;bottom:max(30px,calc(env(safe-area-inset-bottom) + 18px));}
  .callControl{width:58px;min-width:58px;height:58px;border-radius:21px;}
  .callControl span{top:64px;}
  .localVideo{top:max(12px,env(safe-area-inset-top));right:10px;width:104px;border-radius:17px;}
}

@media (orientation:landscape) and (max-height:500px) and (min-width:721px){
  .header{grid-template-columns:1px minmax(0,1fr) 86px!important;}
  .header > .right{grid-column:3;gap:6px!important;}
  .securityDock{top:61px;right:8px;}
  .callIdentity{margin-top:-3vh;transform:translateX(-80px);}
  .callAvatar{width:82px;height:82px;border-radius:28px;font-size:30px;}
  .callPeer{font-size:21px;margin-top:11px;}
  .callControls{left:auto;right:28px;top:50%;bottom:auto;transform:translateY(-50%);flex-direction:column;gap:11px;}
  .callControl{width:52px;min-width:52px;height:52px;border-radius:18px;}
  .callControl span{display:none;}
  .localVideo{width:110px;aspect-ratio:4/3;border-radius:17px;}
}

/* DiValis 2.20.6 — calm desktop empty state */
.emptyHero{
  width:min(420px,88%);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
}
.emptyLogo{
  width:92px;
  height:92px;
  object-fit:cover;
  border-radius:28px;
  box-shadow:0 18px 48px rgba(122,64,85,.16);
  margin-bottom:22px;
}
.emptyHero h2{margin:0 0 9px;font-size:26px;}
.emptyHero > p{margin:0;color:var(--muted);font-size:14px;line-height:1.5;}
.emptyPrivacyPill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:22px;
  padding:9px 13px;
  border:1px solid rgba(104,134,111,.16);
  border-radius:999px;
  color:#63796a;
  background:rgba(255,250,248,.58);
  font-size:11px;
  line-height:1.25;
}
.emptyPrivacyPill .uiIcon{width:15px;height:15px;}
@media (orientation:landscape) and (max-height:500px) and (min-width:721px){
  .emptyLogo{width:68px;height:68px;border-radius:21px;margin-bottom:13px;}
  .emptyHero h2{font-size:21px;margin-bottom:6px;}
  .emptyPrivacyPill{margin-top:13px;}
}

/* DiValis 2.25.22 — fine full-surface floral brand scatter */
.sidebar{
  background-color:rgba(255,250,248,.82)!important;
  background-image:url('/static/divalis-frame.svg?v=2.27.2'),linear-gradient(180deg,rgba(255,250,248,.90),rgba(245,232,228,.90))!important;
  background-size:100% 100%,100% 100%!important;
  background-position:center,center!important;
  background-repeat:no-repeat,no-repeat!important;
}

.main{
  background-color:rgba(255,250,248,.20)!important;
}
.messages,
.empty{
  background-color:transparent!important;
  background-image:url('/static/divalis-frame.svg?v=2.27.2')!important;
  background-size:100% 100%!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
}

@media (max-width:720px){
  .sidebar,
  .messages,
  .empty{
    background-size:100% 100%!important;
  }
}

/* DiValis 2.19.7 — multiline composer up to 15 visible rows */
.messageCapsule #text,
.messageCapsule textarea{
  max-height:316px!important;
  overflow-y:hidden;
}

/* DiValis 2.24.0 — replies, ephemeral hearts and inline voice drafts */
.bubble{
  touch-action:pan-y;
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  transition:transform .16s ease,box-shadow .18s ease,filter .18s ease;
}
.bubble *:not(input):not(textarea){-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;}
#peerTitle{
  -webkit-user-select:none;
  user-select:none;
  -webkit-touch-callout:none;
  touch-action:manipulation;
}
.bubble.replySwiping{
  transform:translateX(var(--reply-swipe-x,0))!important;
  transition:none!important;
}

/* DiValis 2.25.3 — native selection/copy callout is reserved for the composer. */
body,
body *{
  -webkit-user-select:none!important;
  user-select:none!important;
  -webkit-touch-callout:none!important;
}
#text{
  -webkit-user-select:text!important;
  user-select:text!important;
  -webkit-touch-callout:default!important;
}
.bubble.replySwiping::after{
  content:'↩';
  position:absolute;
  right:calc(100% + 10px);
  top:50%;
  transform:translateY(-50%);
  color:#b65f7b;
  font-size:21px;
  font-weight:700;
}
.messageReplyQuote{
  width:100%;
  display:grid;
  gap:2px;
  margin:0 0 7px;
  padding:7px 9px 7px 11px;
  text-align:left;
  color:inherit;
  background:rgba(255,255,255,.32);
  border:0;
  border-left:3px solid #bd6682;
  border-radius:8px 12px 12px 8px;
  cursor:pointer;
  overflow:hidden;
}
.messageReplyQuote.hasThumb{grid-template-columns:minmax(0,1fr) 38px;align-items:center;gap:7px;}
.messageReplyCopy{min-width:0;display:grid;gap:2px;text-align:left;}
.messageReplyQuote strong{font-size:11px;color:#a24c6b;line-height:1.2;}
.messageReplyCopy>span{font-size:12px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.78;}
.messageReplyThumb{width:38px;height:38px;border-radius:8px;object-fit:cover;background:rgba(255,255,255,.45);}
.stickerBubble .messageReplyThumb{object-fit:contain;}
.messageEdited{font-size:10px;opacity:.68;margin-right:5px;}
.decryptPendingBubble .text{opacity:.58;font-style:italic;}
.decryptPendingBubble{animation:decryptPendingPulse 1.4s ease-in-out infinite;}
@keyframes decryptPendingPulse{50%{filter:brightness(1.035)}}
.bubble.outgoing .messageReplyQuote{background:rgba(255,255,255,.18);border-left-color:rgba(255,255,255,.85);}
.bubble.outgoing .messageReplyQuote strong{color:#fff;}
.bubble.replyTargetFlash{animation:replyTargetFlash 1.25s ease;}
@keyframes replyTargetFlash{0%,100%{filter:none}28%{filter:brightness(1.07);box-shadow:0 0 0 5px rgba(190,100,130,.22),0 10px 26px rgba(112,70,80,.15)}}

.replyComposer{
  min-height:46px;
  display:grid;
  grid-template-columns:3px minmax(0,1fr) 34px;
  align-items:center;
  gap:9px;
  margin:0 48px 7px 50px;
  padding:6px 7px 6px 0;
  border-radius:14px;
  background:rgba(255,253,251,.9);
  border:1px solid rgba(137,83,101,.14);
}
.replyComposer.hidden{display:none!important;}
.composer.reply-mode .replyComposer{display:grid!important;}
.replyComposerBar{align-self:stretch;border-radius:4px;background:linear-gradient(#d987a1,#ad4e70);}
.replyComposerBody{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;}
.replyComposerCopy{min-width:0;display:grid;gap:2px;}
.replyComposerBody strong{font-size:12px;color:#a24c6b;}
.replyComposerCopy span{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.replyComposerThumb{width:38px;height:38px;border-radius:9px;object-fit:cover;background:#fff7f2;}
.replyComposerClose,.voiceComposerCancel,.voiceComposerStop,.voiceComposerSend{
  appearance:none;border:0;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:#9f526d;background:transparent;
}
.replyComposerClose{width:32px;height:32px;border-radius:10px;}
.replyComposerClose .uiIcon{width:17px;height:17px;}

.messageContextMenu{
  position:fixed;
  z-index:1800;
  min-width:144px;
  padding:6px;
  border:1px solid rgba(137,83,101,.17);
  border-radius:15px;
  background:rgba(255,250,248,.98);
  box-shadow:0 18px 50px rgba(84,47,59,.2);
  backdrop-filter:blur(18px);
}
.messageReactionBar{
  display:grid;
  grid-template-columns:repeat(6,36px);
  gap:3px;
  padding:2px 2px 7px;
  margin-bottom:5px;
  border-bottom:1px solid rgba(137,83,101,.12);
}
.messageContextMenu .messageReactionChoice{
  width:36px;height:36px;padding:0;display:grid;place-items:center;
  border-radius:12px;font-size:20px;line-height:1;
  transition:transform .14s ease,background .14s ease,box-shadow .14s ease;
}
.messageContextMenu .messageReactionChoice:active{transform:scale(.88);}
.messageContextMenu .messageReactionChoice.selected{
  background:rgba(214,118,148,.2);
  box-shadow:inset 0 0 0 1px rgba(178,77,111,.24);
}
.messageContextMenu.hidden{display:none!important;}
.messageContextMenu button{width:100%;height:40px;border:0;border-radius:10px;background:transparent;color:var(--text);display:flex;align-items:center;gap:10px;padding:0 12px;cursor:pointer;}
.messageContextMenu button:hover,.messageContextMenu button:active{background:rgba(231,190,199,.32);}
.messageContextMenu .uiIcon{width:18px;height:18px;color:#aa536f;}
.messageContextMenu button.hidden{display:none!important;}
.messageContextMenu button.danger{color:#b44f61;}
.messageContextMenu button.danger .uiIcon{color:#b44f61;}
.composer.selection-active{display:none!important;}
.messageSelectionBar{position:absolute;z-index:80;left:14px;right:14px;bottom:max(12px,env(safe-area-inset-bottom));min-height:58px;padding:8px 10px;display:flex;align-items:center;gap:10px;border:1px solid rgba(182,95,123,.2);border-radius:20px;background:rgba(255,250,248,.96);box-shadow:0 16px 42px rgba(92,48,63,.18);backdrop-filter:blur(20px);}
.messageSelectionBar.hidden{display:none!important}.messageSelectionBar>strong{color:#714b59;font-size:13px}.messageSelectionActions{margin-left:auto;display:flex;gap:5px}.messageSelectionActions .icon-btn{width:40px;height:40px;border-radius:13px}.messageSelectionActions .danger{color:#b44f61!important}
.messageSelectionMark{position:absolute;top:50%;width:25px;height:25px;display:grid;place-items:center;transform:translateY(-50%);color:#a1536d;filter:drop-shadow(0 3px 6px rgba(91,47,63,.14));}.messageSelectionMark .uiIcon{width:23px;height:23px}.bubble.incoming .messageSelectionMark{left:-33px}.bubble.outgoing .messageSelectionMark{right:-33px}.bubble.messageSelected{box-shadow:0 0 0 3px rgba(190,91,124,.2),0 9px 24px rgba(89,50,64,.12)!important}.messages:has(.messageSelectionMark){padding-left:48px;padding-right:48px}
.forwardedLabel{display:flex;align-items:center;gap:5px;margin:0 0 5px;color:#a1516d;font-size:11px;font-weight:800}.forwardedLabel .uiIcon{width:13px;height:13px}.forwardPicker{display:grid;gap:7px;max-height:min(54vh,440px);overflow:auto}.forwardTarget{display:block}.forwardTarget>input{position:absolute;opacity:0;pointer-events:none}.forwardTarget>span{display:flex;align-items:center;gap:11px;padding:10px 12px;border:1px solid rgba(133,111,84,.12);border-radius:17px;background:rgba(255,255,255,.5);cursor:pointer}.forwardTarget>input:checked+span{border-color:rgba(182,95,123,.42);background:#f8e3e8;box-shadow:0 0 0 3px rgba(182,95,123,.08)}.forwardTarget>span>span:last-child{display:grid;gap:2px}.forwardTarget small{color:var(--muted);font-size:11px}
.messageSearchSection{display:grid;gap:5px;margin-top:10px;padding-top:10px;border-top:1px solid rgba(137,83,101,.12)}.messageSearchHeading{display:flex;justify-content:space-between;padding:4px 10px;color:#8a5b69;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.messageSearchHeading span{color:var(--muted2);font-weight:700}.messageSearchResult{width:100%;min-width:0;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:9px;padding:9px 10px;border:0;border-radius:15px;background:transparent;color:var(--text);text-align:left;cursor:pointer}.messageSearchResult:hover{background:rgba(241,219,224,.48)}.messageSearchResult>span{min-width:0;display:grid;gap:3px}.messageSearchResult strong,.messageSearchResult>span>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.messageSearchResult>span>span,.messageSearchResult time{color:var(--muted);font-size:11px}
.viewOnceCard,.viewOnceConsumed{min-width:210px;display:flex;align-items:center;gap:11px;padding:12px 13px;border:1px solid rgba(182,95,123,.18);border-radius:17px;background:linear-gradient(145deg,#fffaf8,#f6e5e7);color:#714b59;text-align:left}.viewOnceCard{cursor:pointer}.viewOnceCard>.uiIcon,.viewOnceConsumed>.uiIcon{width:27px;height:27px;color:#b45876}.viewOnceCard>span{display:grid;gap:2px}.viewOnceCard strong{font-size:13px}.viewOnceCard small,.viewOnceConsumed span{color:var(--muted);font-size:11px}
.mediaCaption{padding:8px 4px 2px;color:var(--text);font-size:14px;line-height:1.4;overflow-wrap:anywhere}

.messageReactions{
  display:flex;align-items:center;flex-wrap:wrap;gap:4px;
  margin:7px -3px -5px;
}
.messageReactionChip{
  appearance:none;border:1px solid rgba(144,81,101,.15);
  min-width:29px;height:25px;padding:2px 7px;border-radius:999px;
  display:inline-flex;align-items:center;justify-content:center;gap:4px;
  color:#76515f;background:rgba(255,251,247,.9);
  box-shadow:0 3px 10px rgba(88,48,61,.08);cursor:pointer;
  font-size:15px;line-height:1;-webkit-tap-highlight-color:transparent;
}
.messageReactionChip b{font-size:11px;line-height:1;font-weight:800;color:#8e6674;}
.messageReactionChip.mine{
  background:linear-gradient(145deg,#fff2f5,#f7dce4);
  border-color:rgba(183,83,117,.34);
  box-shadow:0 3px 12px rgba(172,76,109,.13),inset 0 0 0 1px rgba(255,255,255,.55);
}
.messageReactionChip:active{transform:scale(.92);}
.bubble.stickerBubble .messageReactions{margin:6px 0 -13px;justify-content:flex-start;}
.bubble.outgoing .messageReactions{justify-content:flex-end;}

.heartRainLayer{position:fixed;inset:0;z-index:6200;pointer-events:none;overflow:hidden;}
body.music-player-expanded .heartRainLayer{z-index:7550;}
.floatingHeart{position:absolute;bottom:-38px;display:block;filter:drop-shadow(0 5px 7px rgba(130,48,78,.17));animation:heartRise linear forwards;will-change:transform,opacity;}
.floatingHeart.musicLikeHeart{bottom:auto;animation-name:musicLikeHeartRise;filter:drop-shadow(0 7px 10px rgba(117,37,68,.24));}

/* DiValis 2.25.8 — balanced mobile chat header. */
@media (max-width:720px){
  .header{
    grid-template-columns:76px minmax(0,1fr) 76px!important;
    column-gap:7px!important;
  }
  .header > #btnBack{justify-self:start;}
  .header > .peer{grid-column:2!important;width:100%;justify-content:center!important;}
  .header > .peer #peerAvatar{display:flex!important;position:absolute!important;left:-6px!important;top:50%!important;transform:translateY(-50%)!important;width:34px!important;height:34px!important;min-width:34px!important;border-radius:12px!important;}
  .header > .peer #peerAvatar .uiIcon{width:17px!important;height:17px!important;}
  .header > .peer .peerMeta{width:100%!important;margin:0!important;padding:0!important;min-width:0!important;}
  .header > .peer .title{font-size:16px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .header > .right{grid-column:3!important;width:76px!important;justify-content:space-between!important;gap:4px!important;}
  .header > .right .headerCallBtn{width:36px!important;height:36px!important;min-width:36px!important;padding:0!important;border-radius:13px!important;}
  .peerProfileModal .peerProfileHero{
    grid-template-columns:1fr!important;
    gap:13px!important;
    text-align:center!important;
    padding:14px!important;
  }
  .peerProfileModal .peerProfileAvatarHero{display:flex!important;justify-content:center!important;}
  .peerProfileModal .peerProfileAvatarHero .avatar,
  .peerProfileModal .peerProfileAvatar.xl{width:88px!important;height:88px!important;border-radius:25px!important;font-size:32px!important;}
  .peerProfileModal .peerProfileHeroMeta{width:100%!important;gap:9px!important;}
  .peerProfileModal .peerProfileMiniStats{
    width:100%!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .peerProfileModal .peerStat{min-width:0!important;padding:10px 8px!important;background:rgba(255,250,248,.78)!important;border-color:var(--border)!important;}
  .peerProfileModal .peerStat span{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}
}
.floatingHeart svg{display:block;width:100%;height:100%;}
@keyframes heartRise{
  0%{transform:translate3d(0,0,0) rotate(0);opacity:0}
  8%{opacity:.96}
  78%{opacity:.9}
  100%{transform:translate3d(var(--heart-drift),calc(-100dvh - 70px),0) rotate(var(--heart-rotate));opacity:0}
}
@keyframes musicLikeHeartRise{
  0%{transform:translate3d(-50%,8px,0) rotate(0) scale(.28);opacity:0}
  8%{opacity:1}
  26%{transform:translate3d(calc(-50% + var(--heart-drift-near)),var(--heart-rise-near),0) rotate(0) scale(1.08);opacity:1}
  72%{opacity:.92}
  100%{transform:translate3d(calc(-50% + var(--heart-drift)),var(--heart-rise),0) rotate(var(--heart-rotate)) scale(1.18);opacity:0}
}
#peerTitle.heartHolding{color:#ad4e70;transform:scale(.985);}

.voiceComposer{
  min-height:48px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 40px;
  align-items:center;
  gap:6px;
  padding:3px 4px;
  border:1px solid rgba(137,83,101,.18);
  border-radius:24px;
  background:rgba(255,253,251,.96);
  box-shadow:0 5px 16px rgba(112,70,80,.055);
}
.voiceComposer.hidden{display:none!important;}
.composer.voice-mode .composerRow{display:none!important;}
.voiceComposerCancel{width:36px;height:36px;border-radius:13px;background:rgba(190,100,130,.08);}
.voiceComposerCancel .uiIcon{width:17px;height:17px;}
.voiceLive{min-width:0;height:42px;display:grid;grid-template-columns:10px minmax(0,1fr) 43px;gap:7px;align-items:center;}
.voiceComposer.preview .voiceLive{grid-template-columns:34px minmax(0,1fr) 76px;gap:6px;}
.voiceLive.hidden{display:none!important;}
.voiceRecDot{width:8px;height:8px;border-radius:50%;background:#d9546d;box-shadow:0 0 0 5px rgba(217,84,109,.1);animation:voiceRecPulse 1.15s ease-in-out infinite;}
.voiceRecDot.hidden{display:none!important;}
.voiceDraftPlay{
  width:32px;height:32px;display:grid;place-items:center;border:0;border-radius:50%;padding:0;
  color:#fff;background:linear-gradient(135deg,#b85f7c,#d98fa4);box-shadow:0 5px 13px rgba(182,95,123,.2);
}
.voiceDraftPlay.hidden{display:none!important;}
.voiceDraftPlay .uiIcon{width:15px;height:15px;stroke-width:2.2;}
.voiceDraftPlay .uiIcon use[href="#i-play"]{transform:translateX(1px);}
@keyframes voiceRecPulse{50%{transform:scale(.72);opacity:.55}}
#voiceWave{width:100%;height:42px;display:block;}
#voiceRecTimer{font-size:11px;color:#9b6576;font-variant-numeric:tabular-nums;text-align:right;}
.voiceComposerStop,.voiceComposerSend{width:38px;height:38px;border-radius:14px;color:#fff;background:linear-gradient(135deg,#b85f7c,#d98fa4);box-shadow:0 7px 16px rgba(182,95,123,.2);}
.voiceComposerStop .uiIcon,.voiceComposerSend .uiIcon{width:18px;height:18px;}
#voiceDraftPreview{display:none!important;}
#voiceDraftPreview.hidden,.voiceComposerStop.hidden,.voiceComposerSend.hidden{display:none!important;}

@media (max-width:720px){
  .replyComposer{margin:0 42px 6px 42px;}
  .voiceComposer{min-height:46px;grid-template-columns:36px minmax(0,1fr) 38px;}
  .voiceComposerCancel{width:34px;height:34px;}
  .voiceComposerStop,.voiceComposerSend{width:36px;height:36px;}
}

@media (prefers-reduced-motion:reduce){
  .floatingHeart{animation-duration:2.6s!important;}
  .voiceRecDot{animation:none;}
  .decryptPendingBubble{animation:none;}
}

.header > .peer #peerAvatar.hidden,
#audioCallBtn.hidden,
#videoCallBtn.hidden{display:none!important;}

/* Sticker catalog: the picker only renders lightweight still previews. */
.composerRow{grid-template-columns:auto auto minmax(0,1fr) auto;}
.stickerToggle{
  width:38px!important;height:38px!important;min-width:38px!important;
  border-radius:14px!important;color:#a65370!important;background:rgba(255,250,247,.76)!important;
}
.stickerToggle .uiIcon{width:20px;height:20px;}
.stickerPicker{
  position:absolute;z-index:1200;right:14px;bottom:calc(var(--composer-height, 70px) + 12px);
  width:min(410px,calc(100% - 28px));max-height:min(480px,62dvh);display:grid;
  grid-template-rows:auto auto minmax(0,1fr);overflow:hidden;border-radius:25px;
  border:1px solid rgba(137,83,101,.16);background:rgba(255,250,247,.97);
  box-shadow:0 22px 65px rgba(84,47,59,.2);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
}
.stickerPicker.hidden{display:none!important;}
.stickerPickerHead{min-height:62px;padding:11px 12px 9px 17px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(137,83,101,.1);}
.stickerPickerHead>div{display:grid;gap:2px}.stickerPickerHead strong{font-size:16px}.stickerPickerHead span{font-size:11px;color:var(--muted)}
.stickerPickerHead .icon-btn{width:36px;height:36px;border-radius:13px}.stickerPickerHead .uiIcon{width:17px;height:17px}
.stickerPackTabs{display:flex;gap:7px;overflow-x:auto;padding:9px 12px;border-bottom:1px solid rgba(137,83,101,.08);scrollbar-width:none;}
.stickerPackTabs::-webkit-scrollbar{display:none}
.stickerPackTab{min-width:48px;height:45px;padding:4px 8px;display:flex;align-items:center;gap:7px;border:1px solid transparent;border-radius:14px;background:transparent;color:var(--text);cursor:pointer;}
.stickerPackTab.active{background:#f5dfe1;border-color:rgba(182,95,123,.17)}
.stickerPackTab img{width:34px;height:34px;object-fit:contain}.stickerPackTab span{display:none;white-space:nowrap;font-size:12px;font-weight:700}
.stickerGrid{min-height:150px;padding:12px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;}
.stickerGrid{opacity:1;transform:translateY(0) scale(1);transition:opacity .16s ease,transform .2s cubic-bezier(.2,.75,.25,1);will-change:opacity,transform;}
.stickerGrid.packSwitching{opacity:.28;transform:translateY(4px) scale(.992);pointer-events:none;}
.stickerGrid.packSwitching.packSwipeNext{transform:translateX(-18px) scale(.992);}
.stickerGrid.packSwitching.packSwipePrev{transform:translateX(18px) scale(.992);}
.stickerGrid.packSwiping{transition:none;transform:translateX(var(--sticker-swipe-x,0));opacity:.88;}
.stickerTile{aspect-ratio:1;border:0;border-radius:17px;padding:5px;background:transparent;cursor:pointer;touch-action:manipulation;transition:background .15s,transform .1s;-webkit-touch-callout:none;user-select:none;-webkit-user-select:none;}
.stickerTile:hover,.stickerTile:active{background:rgba(229,178,189,.25)}.stickerTile:active{transform:scale(.94)}
.stickerTile img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;}
.stickerPickerState{grid-column:1/-1;min-height:125px;display:grid;place-items:center;text-align:center;color:var(--muted);font-size:13px;}
.bubble.stickerBubble{background:transparent!important;border:0!important;box-shadow:none!important;padding:2px 3px 18px!important;max-width:210px!important;overflow:visible;}
.bubble.stickerBubble .time{position:absolute;right:5px;bottom:1px;min-width:52px;padding:3px 6px;border:1px solid rgba(137,83,101,.1);border-radius:9px;background:rgba(255,250,247,.92);color:#765963!important;backdrop-filter:blur(8px);box-shadow:0 3px 10px rgba(84,47,59,.08);}
.bubble.stickerBubble .time .receipt{color:#58a06b!important;}
.stickerMessage{width:min(180px,44vw);height:min(180px,44vw);display:grid;place-items:center;}
.stickerMessage img{display:block;max-width:100%;max-height:100%;object-fit:contain;filter:drop-shadow(0 7px 10px rgba(89,54,62,.09));}
.stickerHoldPreview{
  --sticker-preview-size:140px;
  position:fixed;z-index:2100;width:var(--sticker-preview-size);height:var(--sticker-preview-size);
  display:grid;place-items:center;padding:10px;border:1px solid rgba(137,83,101,.15);border-radius:30px;
  background:rgba(255,250,247,.96);box-shadow:0 22px 58px rgba(83,47,58,.23);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);pointer-events:none;
  transform-origin:50% 100%;animation:stickerPreviewIn .16s cubic-bezier(.2,.9,.25,1.2);
}
.stickerHoldPreview.hidden{display:none!important}.stickerHoldPreview img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 12px rgba(89,54,62,.1));}
@keyframes stickerPreviewIn{from{opacity:0;transform:translateY(8px) scale(.86)}to{opacity:1;transform:none}}

@media (min-width:721px){
  .stickerPicker{right:18px;bottom:84px}.stickerPackTab span{display:inline}.stickerPackTab{min-width:max-content}
}
@media (max-width:720px){
  html,body,#app,.app,.sidebar,.main{height:var(--app-visual-height,100dvh)!important;max-height:var(--app-visual-height,100dvh)!important;min-height:0!important;}
  .stickerPicker{position:fixed;left:8px;right:8px;bottom:calc(66px + env(safe-area-inset-bottom));width:auto;max-height:52dvh;border-radius:24px;}
  /* Keep the first sticker outside iOS' native screen-edge navigation rail. */
  .stickerGrid{grid-template-columns:repeat(4,minmax(0,1fr));padding:9px 9px 9px max(30px,env(safe-area-inset-left));gap:4px}
  .stickerMessage{width:min(168px,43vw);height:min(168px,43vw)}
}
@media (prefers-reduced-motion:reduce){.stickerTile{transition:none}.stickerHoldPreview{animation:none}}

/* DiValis 2.27.0 — photo messages, upload progress and gallery viewer */
.photoMessage{position:relative;min-width:0;}
.imageThumb::after{display:none;}
.photoSaveBtn{
  position:absolute;right:10px;bottom:10px;z-index:4;width:34px;height:34px;padding:0;
  display:grid;place-items:center;border:1px solid rgba(255,255,255,.58);border-radius:50%;
  color:#fff;background:rgba(70,42,53,.46);box-shadow:0 4px 14px rgba(33,21,27,.22);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);cursor:pointer;
}
.photoSaveBtn .uiIcon{width:18px;height:18px;}
.photoRun{
  width:min(620px,92%);display:flex;gap:9px;overflow-x:auto;overflow-y:hidden;
  padding:2px 44px 8px 2px;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;
}
.photoRun::-webkit-scrollbar{display:none;}
.photoRun.incoming{align-self:flex-start;}
.photoRun.outgoing{align-self:flex-end;}
.photoRun>.bubble{flex:0 0 calc(100% - 42px);width:auto;max-width:none;align-self:stretch;scroll-snap-align:start;}
.photoRun>.bubble .mediaThumb{width:100%;}
.photoRun>.bubble .mediaThumb img{width:100%;height:min(56vw,390px);object-fit:cover;}

.uploadPendingBubble{opacity:.96;overflow:hidden!important;}
.pendingMedia{position:relative;min-width:min(68vw,300px);overflow:hidden;border-radius:17px;background:rgba(40,28,34,.08);}
.pendingMedia img,.pendingMedia video{display:block;width:100%;max-height:340px;object-fit:cover;}
.pendingPlayIcon{position:absolute;left:50%;top:50%;width:42px!important;height:42px!important;transform:translate(-50%,-50%);color:#fff;filter:drop-shadow(0 2px 8px rgba(0,0,0,.45));}
.pendingFile{display:flex;align-items:center;gap:10px;min-width:220px;padding:10px;}
.pendingFile .uiIcon{width:28px;height:28px;}
.pendingUploadStatus{display:grid;gap:6px;margin:9px 4px 2px;font-size:11px;font-weight:700;}
.pendingUploadTrack{display:block;height:5px;border-radius:99px;overflow:hidden;background:rgba(92,54,68,.14);}
.pendingUploadTrack i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#b85f7c,#e3a0b4);transition:width .12s linear;}
.uploadPendingBubble.uploadFailed{filter:saturate(.55);opacity:.76;}

.fullScreenMediaViewer{
  position:fixed!important;inset:0!important;width:100vw!important;height:100dvh!important;
  max-width:none!important;max-height:none!important;margin:0!important;border-radius:0!important;
  border:0!important;background:linear-gradient(180deg,#2d2228,#171216)!important;color:#fff!important;
}
.fullScreenMediaViewer .modal-header{padding:calc(env(safe-area-inset-top) + 8px) 14px 8px!important;background:rgba(31,23,28,.88)!important;border-color:rgba(255,255,255,.08)!important;}
.fullScreenMediaViewer .modal-title{color:#fff!important;}
.fullScreenMediaViewer .icon-btn{color:#fff!important;background:rgba(255,255,255,.1)!important;border-color:rgba(255,255,255,.14)!important;}
.fullScreenMediaViewer .mediaViewerBody{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 0!important;overflow:hidden!important;}
.fullScreenMediaViewer .viewerStage{width:100%;flex:1 1 auto;min-height:0;max-height:none;}
.fullScreenMediaViewer .viewerVideo{max-width:100%;max-height:100%;border-radius:0;background:#000;}
.fullScreenMediaViewer .viewerImageStage{position:relative;width:100%;flex:1 1 auto;min-height:0;max-height:none;overflow:hidden;touch-action:none;}
.fullScreenMediaViewer .viewerImage{position:relative;z-index:3;max-width:calc(100% - 38px);max-height:100%;border-radius:18px;box-shadow:0 16px 50px rgba(0,0,0,.34);will-change:transform;}
.viewerPeek{position:absolute;z-index:1;top:50%;width:78%;height:84%;object-fit:cover;border-radius:18px;opacity:.48;filter:brightness(.65);pointer-events:none;}
.viewerPeekPrev{left:-70%;transform:translateY(-50%);}
.viewerPeekNext{right:-70%;transform:translateY(-50%);}
.viewerNav{position:absolute;z-index:5;top:50%;width:40px;height:54px;margin-top:-27px;border:0;border-radius:16px;color:#fff;background:rgba(20,14,18,.34);backdrop-filter:blur(8px);}
.viewerNav .uiIcon{width:23px;height:23px;}
.viewerNavPrev{left:8px;}.viewerNavNext{right:8px;}.viewerNavNext .uiIcon{transform:rotate(180deg);}
.viewerCounter{min-height:20px;margin-top:5px;font-size:12px;font-weight:700;color:rgba(255,255,255,.72);}
.videoThumb .mediaBadge{left:50%;top:50%;transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border-radius:999px;background:rgba(35,23,29,.48);}
.videoThumb .mediaBadge .uiIcon{width:22px;height:22px;}
.linkPreviewShell{width:min(360px,100%);border-color:rgba(174,103,127,.2);background:rgba(255,250,248,.88);box-shadow:0 7px 18px rgba(92,48,64,.08);}
.linkPreviewShell[data-preview-loaded="0"]{display:none;}
.linkPreviewCard{overflow:hidden;border-radius:inherit;}
.linkPreviewMedia{order:0;aspect-ratio:1.9/1;max-height:190px;background:rgba(174,103,127,.07);}
.linkPreviewMedia img{width:100%;height:100%;max-height:none;object-fit:cover;}
.linkPreviewMeta{order:1;padding:12px 13px 11px;}
.linkPreviewHost{font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:#a65070;opacity:.9;}
.linkPreviewTitle{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;line-height:1.3;}
.linkPreviewDesc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.38;}
.linkPreviewOpen{margin-top:9px;font-size:11px;font-weight:800;color:#a65070;}
.bubble.outgoing .linkPreviewOpen,.bubble.outgoing .linkPreviewHost{color:rgba(255,255,255,.9);}

/* DiValis 2.27.4 — readable counters, calm rich-link cards and iOS photo hold. */
.conversationList .unread,
.item .unread{
  min-width:24px!important;height:24px!important;padding:0 7px!important;
  background:#b84f73!important;border:2px solid #fff7f1!important;
  color:#fff!important;font-size:12px!important;font-weight:900!important;
  line-height:20px!important;text-shadow:0 1px 1px rgba(78,25,44,.24);
  box-shadow:0 3px 9px rgba(145,57,88,.28);
}
.linkPreviewShell{
  border-color:rgba(153,75,103,.2)!important;
  background:#fffaf7!important;color:#513a43!important;
  box-shadow:0 7px 18px rgba(92,48,64,.1)!important;
}
.bubble.outgoing .linkPreviewShell,
.bubble.incoming .linkPreviewShell{background:#fffaf7!important;color:#513a43!important;}
.linkPreviewCard{color:#513a43!important;}
.linkPreviewHostRow{display:flex;align-items:center;gap:8px;margin-bottom:5px;}
.linkPreviewHost{min-width:0;flex:1;color:#a65070!important;opacity:1!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.linkPreviewArrow{display:inline-flex;flex:0 0 auto;color:#a65070;}
.linkPreviewArrow .uiIcon{width:14px;height:14px;}
.linkPreviewTitle{color:#513a43!important;}
.linkPreviewDesc{color:#745d66!important;opacity:1!important;}
.bubble.hasRichLinkPreview .barePreviewUrl{display:none;}
body .photoViewer .viewerImage{
  -webkit-user-select:none!important;user-select:none!important;
  -webkit-touch-callout:default!important;-webkit-user-drag:none!important;
}

@media (max-width:720px){
  .app.mobile-chat .main{touch-action:pan-y;}
}

/* DiValis 2.27.5 — every rich link gets a visual header. */
.linkPreviewMedia.previewMedia{aspect-ratio:1.9/1;max-height:190px;}
.linkPreviewMedia.faviconMedia{
  height:112px;aspect-ratio:auto!important;max-height:none!important;
  display:grid;place-items:center;
  background:
    radial-gradient(circle at 22% 18%,rgba(255,255,255,.82) 0 5%,transparent 30%),
    linear-gradient(135deg,#f9e8e5 0%,#f3d9e2 52%,#e7dff3 100%);
  border-bottom:1px solid rgba(153,75,103,.14);
}
.linkPreviewMedia.faviconMedia img{
  width:58px!important;height:58px!important;max-height:none!important;
  object-fit:contain!important;padding:10px;border-radius:18px;
  background:rgba(255,255,255,.9);
  box-shadow:0 8px 22px rgba(94,51,67,.16);
}
.fullScreenMediaViewer .viewerZoomHint{margin:2px 14px 6px;color:rgba(255,255,255,.58);font-size:11px;text-align:center;}
.fullScreenMediaViewer .modal-actions{padding:8px 12px calc(env(safe-area-inset-bottom) + 8px)!important;background:rgba(31,23,28,.92)!important;border-color:rgba(255,255,255,.08)!important;}
.fullScreenMediaViewer .modal-actions .btn{color:#fff!important;background:rgba(255,255,255,.1)!important;border-color:rgba(255,255,255,.14)!important;}
@media (max-width:720px){
  .photoRun{width:94%;padding-right:38px;}
  .photoRun>.bubble{flex-basis:calc(100% - 34px);}
  .photoRun>.bubble .mediaThumb img{height:min(74vw,390px);}
  .photoSaveBtn{width:32px;height:32px;right:8px;bottom:8px;}
  .fullScreenMediaViewer .modal-actions{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;justify-content:flex-start!important;}
  .fullScreenMediaViewer .modal-actions .btn{flex:0 0 auto!important;min-width:74px!important;}
  .viewerNav{display:none;}
}

/* DiValis 2.27.53 — compact voice cards and stable iOS keyboard viewport. */
.bubble.voiceBubble{
  width:min(370px,86%);
  min-width:min(292px,78vw);
  height:auto!important;
  min-height:69px!important;
  display:flex;
  flex-direction:column;
  padding:8px 9px 7px!important;
  overflow:visible!important;
}
.modernVoice{
  width:100%;
  padding:2px;
  gap:10px;
  border:0;
  border-radius:16px;
  background:transparent;
}
.voicePlayBtn{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  padding:0;
  border-radius:50%;
  color:#a34e6c;
  background:rgba(255,250,247,.68);
  box-shadow:0 4px 12px rgba(103,56,72,.1);
}
.voicePlayBtn .uiIcon{width:18px;height:18px;stroke-width:2.1;}
.voicePlayBtn .uiIcon use[href="#i-play"]{transform:translateX(1px);}
.voiceMainSingle{gap:3px;}
.modernVoice .voiceWave{
  width:100%;
  height:34px;
  align-items:center;
  gap:2px;
}
.modernVoice .voiceBar{
  min-width:2px;
  max-width:5px;
  border-radius:99px;
  background:rgba(139,87,105,.27);
}
.voiceFooter{
  min-width:0;
  min-height:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.voiceFooter .voiceTiming{
  min-width:0;
  padding:0;
  font-size:11px;
  font-weight:700;
  text-align:left;
  color:rgba(86,61,70,.72);
  font-variant-numeric:tabular-nums;
}
.voiceMessageMeta.time{
  flex:0 0 auto;
  min-width:0;
  margin:0!important;
  padding:0!important;
  gap:4px!important;
  font-size:10.5px!important;
  line-height:1!important;
  color:rgba(86,61,70,.7)!important;
}
.bubble.outgoing .voicePlayBtn{color:#fff;background:rgba(255,255,255,.2);box-shadow:none;}
.bubble.outgoing .modernVoice .voiceBar{background:rgba(255,255,255,.38);}
.bubble.outgoing .voiceFooter .voiceTiming,
.bubble.outgoing .voiceMessageMeta.time{color:rgba(255,255,255,.82)!important;}
.modernVoice.is-playing .voicePlayBtn{transform:scale(.98);}
.voiceName{display:none!important;}

/* DiValis 2.27.58 — restrained eucalyptus read/heard accents. */
.receipt.read,
.bubble.stickerBubble .time .receipt{
  color:#52745f!important;
}
.modernVoice.voice-heard{
  --voice-accent:#66876f;
}
.modernVoice.voice-heard .voicePlayBtn{
  color:#fff!important;
}

/* DiValis 2.27.59 — lighter outgoing cards with dark, readable details. */
.bubble.outgoing .msgLink{
  color:#8f3f5d!important;
  text-decoration-color:rgba(143,63,93,.42)!important;
}
.bubble.outgoing .linkPreviewOpen,
.bubble.outgoing .linkPreviewHost{
  color:#94506a!important;
}
.bubble.outgoing .messageReplyQuote{
  background:rgba(255,255,255,.34)!important;
  border-left-color:#a95775!important;
}
.bubble.outgoing .messageReplyQuote strong{color:#6d3b4d!important;}
.bubble.outgoing .voicePlayBtn{
  color:#934b66!important;
  background:rgba(255,255,255,.52)!important;
}
.bubble.outgoing .modernVoice.voice-heard .voicePlayBtn{
  color:#fff!important;
  background:var(--voice-accent)!important;
}
.bubble.outgoing .modernVoice .voiceBar{background:rgba(111,70,85,.28);}
.bubble.outgoing .voiceFooter .voiceTiming,
.bubble.outgoing .voiceMessageMeta.time{color:rgba(87,61,71,.72)!important;}

/* DiValis 2.27.64 — quiet call history rows, separate from chat bubbles. */
.bubble.callEvent{
  align-self:center!important;
  width:auto!important;
  max-width:92%!important;
  margin:5px auto!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#806671!important;
  user-select:none;
  -webkit-user-select:none;
}
.bubble.callEvent::before,.bubble.callEvent::after{display:none!important;content:none!important;}
.callEventInner{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  min-height:28px;
  padding:5px 11px;
  border:1px solid rgba(171,112,133,.12);
  border-radius:999px;
  background:rgba(255,250,247,.5);
  font-size:12px;
  line-height:1.25;
  letter-spacing:.01em;
  backdrop-filter:blur(8px);
}
.callEventInner .uiIcon{width:14px;height:14px;color:#b15c79;stroke-width:1.8;}
.callEventInner time{font-size:10px;color:#aa8e98;font-variant-numeric:tabular-nums;}
.bubble.callEvent.missed .callEventInner>span{
  color:#c53f4c;
  font-weight:750;
}

@media (max-width:720px){
  html{height:100%;overflow:hidden!important;overscroll-behavior:none;}
  body{
    position:fixed!important;
    top:var(--app-visual-top,0px)!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    height:var(--app-visual-height,100dvh)!important;
    min-height:0!important;
    max-height:none!important;
    overflow:hidden!important;
    overscroll-behavior:none;
  }
  #app,.app,.sidebar,.main{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
  }
  .main{overflow:hidden!important;}
  .messages{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch;
  }
  .composer{
    position:relative!important;
    bottom:auto!important;
    flex:0 0 auto!important;
  }
  .bubble.voiceBubble{width:min(344px,92%);min-width:min(278px,82vw);}
  .modernVoice{padding:1px;gap:9px;}
  .voicePlayBtn{width:42px;height:42px;}
  .modernVoice .voiceWave{height:31px;gap:2px;}
}

/* DiValis 2.28.0 — deliberate media composition before sending. */
.uploadCropBtn{
  position:absolute;
  right:18px;
  top:18px;
  z-index:2;
  min-height:32px!important;
  padding:6px 11px!important;
  border-color:rgba(255,255,255,.72)!important;
  background:rgba(41,31,36,.62)!important;
  color:#fff!important;
  box-shadow:0 5px 18px rgba(45,28,36,.16);
  backdrop-filter:blur(10px);
}
.uploadPreviewBody .sheetField textarea,
.uploadPreviewBody .sheetField select{
  width:100%;
  border:1px solid rgba(160,104,124,.24);
  border-radius:15px;
  background:rgba(255,252,248,.9);
  color:#573d47;
  font:inherit;
  outline:none;
}
.uploadPreviewBody .sheetField textarea{min-height:70px;padding:11px 13px;resize:vertical;}
.uploadPreviewBody .sheetField select{height:44px;padding:0 38px 0 13px;}
.uploadPreviewBody .sheetField textarea:focus,
.uploadPreviewBody .sheetField select:focus{border-color:rgba(181,78,116,.52);box-shadow:0 0 0 3px rgba(197,94,132,.09);}
.cropModal{width:min(94vw,560px)!important;}
.cropEditor{display:grid;gap:16px;}
.cropEditor canvas{
  display:block;
  width:min(100%,440px);
  aspect-ratio:1;
  margin:0 auto;
  border-radius:22px;
  background:#21191d;
  box-shadow:0 12px 36px rgba(67,41,51,.2);
  touch-action:none;
  cursor:grab;
}
.cropEditor canvas:active{cursor:grabbing;}
.cropEditor label{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:13px;color:#6d505b;font-size:13px;font-weight:750;}
.cropEditor input[type="range"]{width:100%;accent-color:#bd5b7f;}
.cropEditor .hint{text-align:center;color:#8e747d;font-size:12px;line-height:1.45;}
@media (max-width:720px){
  .cropModal{width:100%!important;}
  .cropEditor{gap:13px;}
  .cropEditor canvas{width:min(100%,calc(100dvh - 230px));max-width:440px;border-radius:18px;}
}
.mediaProcessCard{
  min-width:min(280px,76vw);
  display:grid;
  grid-template-columns:38px minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  padding:10px 11px;
  border:1px solid rgba(163,100,123,.16);
  border-radius:17px;
  background:rgba(255,251,247,.56);
}
.mediaProcessCard>span:nth-child(2){display:grid;gap:2px;min-width:0;}
.mediaProcessCard strong{font-size:13px;color:#624651;}
.mediaProcessCard small{font-size:11px;color:#927984;}
.mediaProcessSpinner{
  width:30px;height:30px;border-radius:50%;
  border:3px solid rgba(181,89,123,.18);
  border-top-color:#b8597c;
  animation:mediaProcessSpin .9s linear infinite;
}
.mediaProcessCard.failed{border-color:rgba(186,66,80,.2);background:rgba(255,241,239,.68);}
.mediaProcessCard.failed>.uiIcon{width:25px;height:25px;color:#bd4454;}
@keyframes mediaProcessSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.mediaProcessSpinner{animation-duration:1.8s}}

/* Long histories keep their layout but off-screen cards skip paint/layout work. */
@supports (content-visibility:auto){
  .messages>.bubble,
  .messages>.photoRun,
  .messages>.daysep{
    content-visibility:auto;
    contain-intrinsic-size:auto 82px;
  }
  .messages>.photoRun{contain-intrinsic-size:auto 320px;}
}

/* DiValis 2.28.2 — roomier conversations and circular contact identity. */
#list .conversationSwipeRow{min-height:84px;}
#list .conversationSwipeRow > .item{
  min-height:84px;
  padding:13px 11px;
  grid-template-columns:52px minmax(0,1fr) auto;
  gap:11px;
}
#list .conversationSwipeRow > .item > .avatar{
  width:52px;
  height:52px;
  min-width:52px;
  border-radius:50%;
  font-size:17px;
}
.header{height:76px;min-height:76px;}
.header > .peer{gap:12px;}
.header > .peer #peerAvatar{
  width:54px;
  height:54px;
  min-width:54px;
  border-radius:50%;
  font-size:17px;
}

@media (max-width:720px){
  .header{height:74px!important;min-height:74px!important;padding-top:9px!important;padding-bottom:9px!important;}
  .header > .peer #peerAvatar{
    left:-34px!important;
    width:50px!important;
    height:50px!important;
    min-width:50px!important;
    border-radius:50%!important;
  }
  .header > .peer #peerAvatar .uiIcon{width:22px!important;height:22px!important;}
  .header > .peer .title{font-size:16.5px!important;}
}

@media (orientation:landscape) and (max-height:500px) and (min-width:721px){
  .header{height:64px!important;min-height:64px!important;}
  .header > .peer #peerAvatar{width:44px;height:44px;min-width:44px;border-radius:50%;}
}

/* DiValis 2.32.8 — safe story overlays and conflict-free viewer zoom. */
html.story-composer-open,body.story-composer-open{overflow:hidden!important;background:#120d10!important;}
.storyComposerOverlay{
  inset:0!important;padding:0!important;background:#120d10!important;align-items:stretch!important;justify-content:stretch!important;
  z-index:1400!important;
}
.storyComposerModal{
  position:relative;width:100dvw!important;height:100dvh!important;max-width:none!important;max-height:none!important;
  border:0!important;border-radius:0!important;background:#120d10!important;box-shadow:none!important;overflow:hidden!important;
}
.storyComposerModal .modal-header{
  position:absolute;z-index:75;left:0;right:0;top:0;height:calc(66px + env(safe-area-inset-top));
  padding:calc(12px + env(safe-area-inset-top)) 18px 10px!important;border:0!important;
  display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,rgba(12,8,10,.86),rgba(12,8,10,0));
  pointer-events:none;
}
.storyComposerModal .modal-title{color:#fff!important;font-size:15px!important;font-weight:760!important;letter-spacing:.01em;text-shadow:0 1px 12px rgba(0,0,0,.38);}
.storyComposerModal #modalClose{
  pointer-events:auto;position:absolute;left:16px;bottom:10px;width:42px;height:42px;border:1px solid rgba(255,255,255,.16);
  border-radius:50%;display:grid;place-items:center;background:rgba(18,13,16,.48);color:#fff;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
}
.storyComposerModal #modalClose .uiIcon{width:19px;height:19px;}
.storyComposerModal .modal-actions{
  position:absolute;z-index:76;right:16px;top:calc(12px + env(safe-area-inset-top));padding:0!important;border:0!important;background:transparent!important;
}
.storyComposerPublish{
  min-height:42px;padding:0 18px;border:1px solid rgba(255,255,255,.16);border-radius:999px;
  background:linear-gradient(135deg,#d96f94,#b84f76);color:#fff;font:inherit;font-size:12.5px;font-weight:820;letter-spacing:.01em;
  box-shadow:0 10px 26px rgba(164,59,96,.32);cursor:pointer;
}
.storyComposerPublish:disabled{opacity:.58;filter:saturate(.55);cursor:wait;}
.storyComposerBody{padding:0!important;overflow:hidden!important;background:#120d10!important;}
.storyComposerShell{position:relative;width:100%;height:100%;min-height:0;display:flex;flex-direction:column;background:#120d10;isolation:isolate;}
.storyComposerStage{position:relative;flex:1 1 auto;min-height:0;display:grid;place-items:center;overflow:hidden;background:#171114;container-type:size;}
.storyComposerBackdrop{position:absolute;inset:-30px;z-index:-1;background:radial-gradient(circle at 50% 38%,rgba(145,76,101,.20),rgba(18,13,16,.92) 68%);filter:blur(18px);transform:scale(1.06);}
.storyViewportFrame{position:absolute;z-index:1;left:50%;top:50%;width:min(100%,56.25dvh);max-width:100%;max-height:100%;aspect-ratio:9/16;transform:translate(-50%,-50%);overflow:hidden;background:#000;}
@supports (width:1cqw){.storyViewportFrame{width:min(100cqw,56.25cqh);height:min(100cqh,177.7778cqw);max-width:none;max-height:none;}}
.storyPublishPreview{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;min-height:0!important;border:0!important;border-radius:0!important;display:grid!important;place-items:center!important;background:transparent!important;overflow:hidden!important;}
.storyPublishPreview img,.storyPublishPreview video{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:cover!important;object-position:50% 50%!important;display:block!important;background:#000!important;}
.storyPublishPreview video{border:0;outline:0;}
.storyPublishPreview img,.storyPublishPreview video{transform-origin:center;will-change:transform,filter;transition:filter .22s ease}.storyPublishPreview.editing{touch-action:none;cursor:grab}.storyPublishPreview.editing:active{cursor:grabbing}.storyPublishPreview.editing::after{content:"";position:absolute;z-index:3;inset:9px;border:1px solid rgba(255,255,255,.48);border-radius:18px;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(184,77,115,.36)}
.storyComposerStage::after{content:"";position:absolute;z-index:2;inset:auto 0 0;height:24%;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(11,7,9,.62));}
.storyComposerLifetime{
  position:absolute;z-index:8;right:18px;bottom:18px;display:flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;
  color:rgba(255,255,255,.78);background:rgba(16,11,14,.42);border:1px solid rgba(255,255,255,.1);font-size:9.5px;font-weight:700;
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
}
.storyComposerLifetime>span{width:6px;height:6px;border-radius:50%;background:#e58ba7;box-shadow:0 0 0 4px rgba(229,139,167,.14);}
.storyComposerMusicStatus{
  position:absolute;z-index:8;left:18px;bottom:18px;max-width:min(68vw,360px);min-height:42px;padding:7px 11px 7px 9px;border-radius:15px;
  display:flex;align-items:center;gap:9px;color:#fff;background:rgba(16,11,14,.52);border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 10px 28px rgba(0,0,0,.18);
}
.storyComposerMusicStatus>.uiIcon{width:18px;height:18px;flex:0 0 18px;color:#f2a2bc;}
.storyComposerMusicStatus>span{min-width:0;display:grid;gap:2px}.storyComposerMusicStatus strong,.storyComposerMusicStatus small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.storyComposerMusicStatus strong{font-size:11px}.storyComposerMusicStatus small{font-size:9px;color:rgba(255,255,255,.66)}
.storyReplayPreview{--preview-progress:0%;position:absolute;z-index:13;right:12px;top:calc(128px + env(safe-area-inset-top));height:37px;padding:4px 10px 4px 5px;border:1px solid rgba(255,255,255,.16);border-radius:999px;display:flex;align-items:center;gap:7px;background:rgba(18,13,16,.48);color:#fff;box-shadow:0 8px 22px rgba(0,0,0,.18);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);font:inherit;font-size:9.5px;font-weight:780}.storyReplayPreview>span{position:relative;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#df7b9d,#a94368)}.storyReplayPreview>span::after{content:"";position:absolute;inset:-3px;border-radius:50%;background:conic-gradient(#fff var(--preview-progress),rgba(255,255,255,.2) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 0);mask:radial-gradient(farthest-side,transparent calc(100% - 2px),#000 0);transition:background .06s linear}.storyReplayPreview.is-replaying>span::after{filter:drop-shadow(0 0 3px rgba(255,255,255,.32))}.storyReplayPreview .uiIcon{width:12px;height:12px}
.storyComposerDock{
  position:relative;z-index:12;flex:0 0 auto;display:grid;grid-template-columns:minmax(142px,190px) minmax(0,1fr);gap:10px;
  padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(180deg,#1d1519,#120d10);border-top:1px solid rgba(255,255,255,.08);
}
.storyMusicEditor{min-width:0!important;min-height:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;}
.storyMusicToggle{
  width:100%!important;height:52px!important;min-height:52px!important;padding:7px 10px!important;border:1px solid rgba(255,255,255,.1)!important;border-radius:17px!important;
  background:rgba(255,255,255,.07)!important;color:#fff!important;gap:9px!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.storyMusicToggle:active{transform:scale(.985)}.storyMusicToggle.has-music{border-color:rgba(226,117,151,.4)!important;background:rgba(190,80,116,.16)!important;}
.storyMusicToggleIcon{width:36px!important;height:36px!important;flex:0 0 36px!important;border-radius:12px!important;background:linear-gradient(145deg,#e17c9d,#a84168)!important;box-shadow:0 7px 18px rgba(164,57,95,.26)!important;}
.storyMusicToggle strong{color:#fff!important;font-size:11.5px!important}.storyMusicToggle small{color:rgba(255,255,255,.58)!important;font-size:8.5px!important}.storyMusicToggle>.uiIcon{width:15px!important;height:15px!important;color:rgba(255,255,255,.55)!important;transform:none!important;}
.storyComposerCaption{min-width:0;height:52px;margin:0!important;padding:6px 12px;display:flex!important;align-items:center;gap:9px;border:1px solid rgba(255,255,255,.1);border-radius:17px;background:rgba(255,255,255,.07);}
.storyComposerCaption>.uiIcon{width:18px;height:18px;flex:0 0 18px;color:rgba(255,255,255,.58)}
.storyPublishBody .storyComposerCaption textarea{width:100%;height:24px;max-height:92px;min-height:24px!important;padding:2px 0!important;resize:none!important;border:0!important;border-radius:0!important;background:transparent!important;color:#fff!important;font-size:13px;line-height:20px;outline:0;box-shadow:none!important;}
.storyComposerCaption textarea::placeholder{color:rgba(255,255,255,.48)}
.storyUploadProgress{position:absolute;left:16px;right:16px;bottom:calc(7px + env(safe-area-inset-bottom));z-index:80;height:3px;background:rgba(255,255,255,.12)}.storyUploadProgress span{background:linear-gradient(90deg,#ed92af,#c9507a)}
.storyComposerModal.music-open::before{content:"";position:absolute;z-index:49;inset:0;background:rgba(7,4,6,.68);pointer-events:none;}
.storyMusicPanel{
  position:fixed!important;z-index:60;left:50%;bottom:0;width:min(720px,100vw);height:min(78dvh,760px);padding:0!important;border:1px solid rgba(255,255,255,.11)!important;border-bottom:0!important;
  border-radius:28px 28px 0 0!important;display:flex;flex-direction:column;background:linear-gradient(180deg,#fffaf6,#f7e9e9 72%,#f2e0e4)!important;color:#5d414b;
  box-shadow:0 -24px 80px rgba(0,0,0,.38)!important;overflow:hidden!important;transform:translate(-50%,var(--music-sheet-y,0px));animation:storySheetIn .25s cubic-bezier(.22,.8,.24,1);
}
.storyMusicPanel.gesture-following{animation:none!important;transition:none!important;will-change:transform;}
.storyMusicPanel.gesture-settling{animation:none!important;transition:transform .19s cubic-bezier(.2,.78,.2,1)!important;will-change:transform;}
@keyframes storySheetIn{from{transform:translate(-50%,100%)}to{transform:translate(-50%,0)}}
.storyMusicSheetTop{position:relative;flex:0 0 auto;min-height:76px;padding:23px 58px 12px 20px;display:flex;align-items:center;touch-action:none;border-bottom:1px solid rgba(132,73,91,.09);}
.storyMusicSheetTop>div{display:grid;gap:3px}.storyMusicSheetTop strong{font-size:20px;color:#553944}.storyMusicSheetTop small{font-size:10px;color:#9b7a86}.storyMusicSheetHandle{position:absolute;left:50%;top:8px;width:42px;height:5px;border-radius:999px;background:#dcc4ca;transform:translateX(-50%)}
.storyMusicSheetClose{position:absolute;right:14px;bottom:12px;width:38px;height:38px;padding:0;border:1px solid rgba(129,72,89,.12);border-radius:50%;display:grid;place-items:center;background:#fff;color:#76525f}.storyMusicSheetClose .uiIcon{width:17px;height:17px}
.storyMusicSheetScroll{flex:1 1 auto;min-height:0;padding:14px 16px calc(28px + env(safe-area-inset-bottom));overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;scrollbar-width:none}.storyMusicSheetScroll::-webkit-scrollbar{display:none}
.storyMusicSearch{position:relative;display:flex!important;align-items:center;gap:8px;padding:0!important;margin-bottom:10px}.storyMusicSearch>span{position:absolute;z-index:2;left:13px;top:50%;transform:translateY(-50%);color:#b06a80}.storyMusicSearch>span .uiIcon{width:17px;height:17px}.storyMusicSearch input{height:48px!important;padding:0 52px 0 40px!important;border:1px solid rgba(151,83,104,.13)!important;border-radius:17px!important;background:rgba(255,255,255,.76)!important;color:#583e48!important;font-size:13px!important;box-shadow:0 7px 20px rgba(100,49,68,.05)}
.storyMusicSearch button{position:absolute;right:5px;top:5px;width:38px;height:38px;padding:0;border:0;border-radius:13px;display:grid;place-items:center;background:#bb5879;color:#fff}.storyMusicSearch button .uiIcon{width:16px;height:16px}
.storyMusicSourceRow{min-height:34px!important;margin-bottom:9px;color:#a0838c!important;font-size:10px!important}.storyMusicUpload{height:32px!important;margin:0!important;padding:0 11px!important;border:1px solid rgba(166,88,113,.14)!important;border-radius:999px!important;display:flex!important;align-items:center!important;gap:5px!important;background:#fff8f5!important;color:#8e5a6c!important;font-size:9.5px!important;font-weight:750}.storyMusicUpload .uiIcon{width:13px;height:13px}
.storyMusicPopularSection{gap:10px!important;margin:0 0 13px!important}.storyMusicPopularHead strong{font-size:13px!important;color:#5b3f49!important}.storyMusicPopularHead small{font-size:9.5px!important}.storyMusicPopularHead button{width:34px!important;height:34px!important;background:#fff!important;box-shadow:0 4px 12px rgba(91,42,59,.07)}
.storyMusicPopularViewport{margin:0 -2px;width:calc(100% + 4px)!important;padding:2px;scroll-padding:2px;touch-action:pan-x!important;}
.storyMusicPopular{gap:10px!important;padding:0!important}.storyMusicPopularCard{--buffer-progress:0%;width:100%!important;min-width:100%!important;min-height:166px!important;padding:13px!important;border:1px solid rgba(153,84,106,.12)!important;border-radius:21px!important;grid-template-columns:128px minmax(0,1fr)!important;gap:15px!important;overflow:hidden;background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(250,237,238,.88))!important;box-shadow:0 12px 30px rgba(95,45,62,.08)!important;}
.storyMusicPopularCard>img,.storyMusicPopularCard>.storyMusicArtworkFallback{width:128px!important;height:128px!important;border-radius:17px!important}.storyMusicPopularCard strong{font-size:14px!important;color:#573b45}.storyMusicPopularCard small{font-size:11px!important}.storyMusicPopularPlay{position:absolute!important;left:53px!important;top:53px!important;width:48px!important;height:48px!important;margin:0!important;background:rgba(42,24,31,.78)!important;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.storyMusicPopularPlay .uiIcon{width:18px!important;height:18px!important}.storyMusicPopularAdd{right:15px!important;bottom:15px!important;width:34px!important;height:34px!important;padding:0!important;border:2px solid #fff!important;background:#bc5879!important;cursor:pointer}.storyMusicPopularProgress{position:absolute;z-index:7;left:12px;right:12px;bottom:0;height:3px;border-radius:999px 999px 0 0;overflow:hidden;background:rgba(139,80,100,.12);pointer-events:none}.storyMusicPopularProgress>i{display:block;width:var(--buffer-progress);height:100%;border-radius:inherit;background:linear-gradient(90deg,#d5648a,#f09bb5);transition:width .16s linear}.storyMusicPopularCard.is-loading .storyMusicPopularProgress>i{min-width:4%}.storyMusicPopularCard.is-playing{border-color:rgba(188,90,122,.55)!important;box-shadow:0 14px 34px rgba(145,54,87,.16)!important}
.storyMusicResults{max-height:none!important;gap:7px!important;overflow:visible!important}.storyMusicResult{min-height:64px!important;padding:8px!important;border:1px solid rgba(151,82,104,.1)!important;border-radius:17px!important;background:rgba(255,255,255,.72)!important}.storyMusicResult img,.storyMusicResult .storyMusicArtworkFallback{width:48px!important;height:48px!important;border-radius:13px!important}.storyMusicResult strong{font-size:12.5px!important}.storyMusicResult small{font-size:10px!important}
.storyMusicResult small{display:flex!important;min-width:0;gap:4px;align-items:center}.storyMusicResult small em{flex:0 0 auto;padding:2px 5px;border-radius:999px;background:#f2e2e6;color:#9a6074;font-size:7.8px;font-style:normal;font-weight:750}.storyMusicResultPlay,.storyMusicAdd{border:0;padding:0;cursor:pointer}.storyMusicResultPlay{--load-progress:4%;position:relative;isolation:isolate;width:34px;height:34px;flex:0 0 34px;border-radius:50%;display:grid;place-items:center;background:#f1e0e4;color:#9e4f6b;transition:transform .12s ease}.storyMusicResultPlay:active,.storyMusicAdd:active{transform:scale(.88)}.storyMusicResultPlay .uiIcon{width:15px;height:15px}.storyMusicResultPlay.is-loading::before{content:"";position:absolute;z-index:3;inset:-3px;border-radius:50%;background:conic-gradient(#d86d92 var(--load-progress),rgba(201,91,128,.15) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 0);mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 0);animation:storyLoadRing .85s linear infinite}.storyMusicResultPlay.is-playing{background:#b95075;color:#fff}.storyMusicAdd{background:#f3dce2}.storyMusicAdd .uiIcon{width:15px;height:15px}
.storyMusicSelected{margin:0 0 13px!important;padding:13px!important;border:1px solid rgba(153,82,105,.14)!important;border-radius:22px!important;background:rgba(255,255,255,.86)!important;box-shadow:0 12px 34px rgba(91,43,60,.08)!important;}
.storyMusicSelectedHead{gap:10px!important}.storyMusicSelectedHead>img,.storyMusicSelectedHead>.storyMusicArtworkFallback{width:54px!important;height:54px!important;border-radius:15px!important}.storyMusicSelectedHead strong{font-size:13.5px!important}.storyMusicSelectedHead small{font-size:10px!important}.storyMusicPlay{width:42px!important;height:42px!important;flex-basis:42px!important;background:linear-gradient(145deg,#d96f94,#aa456b)!important}.storyMusicRemove{width:34px!important;height:34px!important;flex-basis:34px!important;background:#f3e4e7!important}
.storyMusicFragmentSummary{margin-top:12px!important;padding:9px 11px!important;border-radius:13px!important;background:#f8edf0!important;flex-direction:row!important;align-items:center!important;color:#9c7783!important}.storyMusicFragmentSummary strong{font-size:11.5px!important;color:#6a4653!important}
.storyMusicTimeline{gap:4px!important;margin-top:13px!important}.storyMusicTimelineLabels{font-size:10px!important;padding:0 2px}.storyMusicTimelineLabels b{font-size:11px;color:#5e3c49!important}
.storyMusicRangeTrack{position:relative!important;height:72px!important;margin:0!important;border-radius:18px!important;background:#f2e3e7!important;touch-action:none!important;overflow:visible!important;cursor:ew-resize!important;user-select:none!important;-webkit-user-select:none!important;}
.storyMusicRangeTrack input{display:none!important}.storyMusicWaveform{position:absolute;inset:10px 0;display:flex;align-items:center;gap:2px;overflow:hidden;border-radius:10px;pointer-events:none}.storyMusicWaveform i{flex:1 1 0;min-width:1px;height:var(--bar);border-radius:999px;background:#cdb4bc;opacity:.82}.storyMusicRangeSelection{position:absolute;z-index:2;left:var(--clip-start);right:calc(100% - var(--clip-end));top:7px;bottom:7px;border:2px solid #c1587b;border-radius:14px;background:rgba(193,88,123,.1);box-shadow:0 4px 14px rgba(151,54,87,.12);pointer-events:none}
.storyMusicBoundary{position:absolute;z-index:4;top:0;width:38px;height:72px;padding:0;border:0;background:transparent;touch-action:none;transform:translateX(-50%);cursor:ew-resize}.storyMusicBoundary.start{left:var(--clip-start)}.storyMusicBoundary.end{left:var(--clip-end)}.storyMusicBoundary>span{display:block;width:8px;height:48px;margin:auto;border:2px solid #fff;border-radius:999px;background:#c1587b;box-shadow:0 3px 12px rgba(94,36,57,.32)}.storyMusicRangeTrack.is-dragging .storyMusicBoundary>span{transform:scaleX(1.15);background:#a84067}
.storyMusicDurationChoices{display:flex!important;justify-content:center;gap:7px!important;margin-top:9px!important;padding:0!important;overflow:visible!important}.storyMusicDurationChoice{min-width:54px!important;height:34px!important;border-radius:999px!important;background:#fbf3f2!important}.storyMusicDurationChoice.active{background:linear-gradient(135deg,#c35d80,#dc829e)!important}
.storyMusicMix{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;margin-top:14px!important}.storyMusicMix label{margin:0!important}.storyMusicMix label>span{font-size:10px!important}.storyMusicMix input{accent-color:#be587a!important}
.storyMusicApply,.storyMusicDone{width:100%;min-height:46px;margin-top:14px;border:0;border-radius:15px;background:linear-gradient(135deg,#c35c7f,#dd829e);color:#fff;font:inherit;font-size:12.5px;font-weight:820;box-shadow:0 9px 21px rgba(169,65,101,.22)}
.storyMusicAppliedActions{margin-top:12px!important;display:grid!important;grid-template-columns:1fr auto;align-items:center!important;gap:9px!important}.storyMusicBack,.storyMusicDone{min-height:40px;margin:0;padding:0 13px;border:1px solid rgba(151,82,104,.13);border-radius:13px;display:flex!important;align-items:center;justify-content:center;gap:6px;background:#fff8f6;color:#87586a;font:inherit;font-size:10.5px;font-weight:750}.storyMusicDone{width:auto;min-width:96px;border:0;background:#bb5879;color:#fff}.storyMusicBack .uiIcon{width:14px;height:14px}
.storyMusicPanel.has-applied .storyMusicSelected{margin-top:2px!important}.storyMusicPanel.has-search .storyMusicResults{max-height:none!important}.storyMusicEmpty{padding:24px 12px!important}.storyMusicLoading{min-height:100px!important}

/* Story sequences, transformable text, and precise audio feedback. */
.storyComposerFrames{position:absolute;z-index:14;left:12px;right:12px;top:calc(70px + env(safe-area-inset-top));display:flex;align-items:center;gap:7px;pointer-events:none}
.storyFrameStrip{min-width:0;display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;pointer-events:auto;overscroll-behavior-x:contain}.storyFrameStrip::-webkit-scrollbar{display:none}
.storyFrameThumb,.storyAddFrame,.storyRemoveFrame{position:relative;width:40px;height:52px;min-width:40px;padding:0;border:1px solid rgba(255,255,255,.22);border-radius:13px;overflow:hidden;background:rgba(20,13,17,.58);color:#fff;box-shadow:0 5px 16px rgba(0,0,0,.22);pointer-events:auto;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.storyFrameThumb img,.storyFrameThumb video{width:100%;height:100%;display:block;object-fit:cover}.storyFrameThumb>span:last-child{position:absolute;right:3px;bottom:3px;min-width:15px;height:15px;padding:0 3px;border-radius:999px;display:grid;place-items:center;background:rgba(12,8,10,.72);font-size:8px;font-weight:800}.storyFrameThumb.active{border:2px solid #ef9ab5;box-shadow:0 0 0 2px rgba(233,126,159,.24),0 7px 20px rgba(0,0,0,.25)}
.storyFrameVideoMark{position:absolute!important;left:50%;top:50%;right:auto!important;bottom:auto!important;width:18px!important;height:18px!important;min-width:0!important;padding:0!important;transform:translate(-50%,-50%);background:rgba(14,9,12,.62)!important}.storyFrameVideoMark .uiIcon{width:10px;height:10px}
.storyAddFrame,.storyRemoveFrame{width:38px;height:38px;min-width:38px;border-radius:50%;display:grid;place-items:center}.storyAddFrame{background:rgba(194,84,121,.72)}.storyRemoveFrame{margin-left:auto;background:rgba(38,24,29,.62)}.storyAddFrame .uiIcon,.storyRemoveFrame .uiIcon{width:16px;height:16px}
.storyTextCanvas,.storyPlaybackTextCanvas{position:absolute;z-index:7;inset:0;overflow:hidden;pointer-events:none}.storyTextCanvas.has-active-text{pointer-events:auto;touch-action:none}.storyTextLayer,.storyPlaybackText,.storyTextInlineInput{position:absolute;left:var(--text-x);top:var(--text-y);max-width:86%;transform:translate(-50%,-50%) scale(var(--text-scale)) rotate(var(--text-rotate));transform-origin:center;color:var(--text-color);font-size:clamp(18px,6vw,38px);line-height:1.08;letter-spacing:-.025em;text-align:center;text-wrap:balance;text-shadow:0 2px 8px rgba(0,0,0,.72),0 1px 1px rgba(0,0,0,.65);white-space:pre-wrap;overflow-wrap:anywhere}.storyTextLayer[data-text-font="modern"],.storyPlaybackText[data-text-font="modern"],.storyTextInlineInput[data-text-font="modern"]{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.storyTextLayer[data-text-font="serif"],.storyPlaybackText[data-text-font="serif"],.storyTextInlineInput[data-text-font="serif"]{font-family:Georgia,"Times New Roman",serif}.storyTextLayer[data-text-font="rounded"],.storyPlaybackText[data-text-font="rounded"],.storyTextInlineInput[data-text-font="rounded"]{font-family:ui-rounded,"SF Pro Rounded","Arial Rounded MT Bold",system-ui,sans-serif}.storyTextLayer[data-text-size="small"],.storyPlaybackText[data-text-size="small"],.storyTextInlineInput[data-text-size="small"]{font-size:clamp(14px,4.3vw,27px)}.storyTextLayer[data-text-size="large"],.storyPlaybackText[data-text-size="large"],.storyTextInlineInput[data-text-size="large"]{font-size:clamp(25px,8vw,54px)}.storyTextLayer.is-bold,.storyPlaybackText.is-bold,.storyTextInlineInput.is-bold{font-weight:850}.storyTextLayer:not(.is-bold),.storyPlaybackText:not(.is-bold),.storyTextInlineInput:not(.is-bold){font-weight:600}.storyTextLayer.is-italic,.storyPlaybackText.is-italic,.storyTextInlineInput.is-italic{font-style:italic}.storyTextLayer.is-struck,.storyPlaybackText.is-struck,.storyTextInlineInput.is-struck{text-decoration:line-through;text-decoration-thickness:.08em}
.storyTextLayer{z-index:7;padding:8px 10px;border:1px solid transparent;border-radius:11px;background:transparent;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none}.storyTextLayer.active{border-color:rgba(255,255,255,.86);background:rgba(11,7,10,.2);box-shadow:0 0 0 2px rgba(217,105,143,.45),0 8px 28px rgba(0,0,0,.16)}.storyTextLayer.is-editing{opacity:.08}.storyTextInlineInput{z-index:9;width:min(82%,560px);min-height:52px;max-height:180px;margin:0;padding:8px 12px;border:1px solid rgba(255,255,255,.86);border-radius:12px;resize:none;overflow:hidden;background:rgba(11,7,10,.2);caret-color:#fff;outline:0;box-shadow:0 0 0 2px rgba(217,105,143,.45),0 10px 32px rgba(0,0,0,.2);touch-action:manipulation}.storyTextInlineInput::placeholder{color:rgba(255,255,255,.62)}.storyTextCancel{position:absolute;z-index:12;width:32px;height:32px;margin:0;padding:0;border:1px solid rgba(255,255,255,.5);border-radius:50%;display:grid;place-items:center;transform:translate(-50%,-50%);background:rgba(41,22,30,.82);color:#fff;box-shadow:0 5px 18px rgba(0,0,0,.3),0 0 0 2px rgba(213,101,139,.32);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);touch-action:manipulation}.storyTextCancel .uiIcon{width:14px;height:14px;stroke-width:2.3}.storyTextCancel:active{transform:translate(-50%,-50%) scale(.9);background:#b64f73}
.storyTextLayer.is-editing{opacity:1;background:rgba(11,7,10,.26)}.storyTextValue{display:inline-block;min-width:1ch;outline:0}.storyTextValue[contenteditable="true"]{min-width:2.2ch;caret-color:#fff;user-select:text;-webkit-user-select:text;touch-action:manipulation}.storyTextValue[contenteditable="true"]:empty::before{content:'Текст';color:rgba(255,255,255,.58);pointer-events:none}
.storyTextAdd{min-width:0;height:52px;padding:7px 11px;border:1px solid rgba(255,255,255,.1);border-radius:17px;display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.07);color:#fff;text-align:left}.storyTextAddIcon{width:36px;height:36px;flex:0 0 36px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,#f3b3c6,#b94d74);font:800 16px/1 Georgia,serif;box-shadow:0 7px 18px rgba(164,57,95,.24)}.storyTextAdd>span:last-child{min-width:0;display:grid;gap:2px}.storyTextAdd strong{font-size:11.5px}.storyTextAdd small{font-size:8.5px;color:rgba(255,255,255,.58)}.storyTextAdd:active{transform:scale(.985)}
.storyTextEditor{position:absolute;z-index:20;left:10px;right:10px;bottom:10px;display:flex;justify-content:center;pointer-events:none}.storyTextEditorCard{width:min(680px,100%);padding:10px;border:1px solid rgba(255,255,255,.18);border-radius:22px;background:linear-gradient(145deg,rgba(31,21,26,.92),rgba(17,12,15,.9));box-shadow:0 18px 48px rgba(0,0,0,.4);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);pointer-events:auto}.storyTextEditorTop{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:0 4px 7px;color:#fff}.storyTextEditorTop strong{font-size:12px}.storyTextEditorTop small{font-size:8.5px;color:rgba(255,255,255,.55)}.storyTextColors{display:flex;align-items:center;justify-content:center;gap:9px;padding:2px 4px 9px;overflow-x:auto;scrollbar-width:none}.storyTextColors::-webkit-scrollbar{display:none}.storyTextColors button{width:27px;height:27px;min-width:27px;padding:0;border:2px solid rgba(255,255,255,.9);border-radius:50%;background:var(--swatch);box-shadow:0 0 0 1px rgba(0,0,0,.3),0 4px 12px rgba(0,0,0,.18)}.storyTextColors button.active{box-shadow:0 0 0 3px #dd7598,0 5px 15px rgba(0,0,0,.26);transform:scale(1.08)}.storyTextTools{display:flex;align-items:center;gap:7px;padding:1px 0 9px;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none}.storyTextTools::-webkit-scrollbar{display:none}.storyTextToolGroup{flex:0 0 auto;display:flex;gap:3px;padding:3px;border-radius:13px;background:rgba(255,255,255,.07)}.storyTextToolGroup button{min-width:34px;height:32px;padding:0 8px;border:0;border-radius:10px;background:transparent;color:rgba(255,255,255,.68);font:750 12px/1 inherit}.storyTextToolGroup button.active{background:linear-gradient(145deg,#df7c9d,#b84c72);color:#fff;box-shadow:0 5px 13px rgba(159,54,89,.27)}.storyTextFonts button:nth-child(2){font-family:Georgia,serif}.storyTextFonts button:nth-child(3){font-family:ui-rounded,"SF Pro Rounded",system-ui,sans-serif}.storyTextEditorActions{display:grid;grid-template-columns:40px minmax(0,1fr) 84px;gap:7px}.storyTextEditorActions button{height:39px;border:0;border-radius:12px;display:flex;align-items:center;justify-content:center;gap:6px;font:800 10.5px/1 inherit}.storyTextEditorActions .uiIcon{width:15px;height:15px}.storyTextDelete{background:rgba(255,255,255,.08);color:#ef9ab6}.storyTextEditValue{background:rgba(255,255,255,.09);color:#fff}.storyTextDone{background:linear-gradient(135deg,#c45b7e,#df829e);color:#fff}.storyTextEditorActions button:active{transform:scale(.97)}
.storyComposerShell.text-editing .storyComposerDock,.storyComposerShell.image-editing .storyComposerDock{display:none}.storyComposerShell.text-editing .storyComposerLifetime,.storyComposerShell.text-editing .storyComposerMusicStatus,.storyComposerShell.image-editing .storyComposerLifetime,.storyComposerShell.image-editing .storyComposerMusicStatus{opacity:.28;pointer-events:none}.storyTextEditor{position:relative;left:auto;right:auto;bottom:auto;z-index:25;flex:0 0 auto;width:100%;max-height:min(43dvh,210px);padding:9px 10px calc(9px + env(safe-area-inset-bottom));overflow-y:auto;background:linear-gradient(180deg,#1d1519,#120d10);border-top:1px solid rgba(255,255,255,.08)}.storyTextEditorCard{box-shadow:0 12px 38px rgba(0,0,0,.28)}
.storyImageEditor{position:relative;z-index:25;flex:0 0 auto;width:100%;max-height:min(38dvh,190px);padding:9px 10px calc(9px + env(safe-area-inset-bottom));overflow-y:auto;background:linear-gradient(180deg,#1d1519,#120d10);border-top:1px solid rgba(255,255,255,.08);color:#fff}.storyImageEditorCard{width:min(680px,100%);margin:auto;padding:9px;border:1px solid rgba(255,255,255,.14);border-radius:20px;background:rgba(255,255,255,.055)}.storyImageEditorTop{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 3px 8px}.storyImageEditorTop>span{min-width:0;display:grid;gap:2px}.storyImageEditorTop strong{font-size:12px}.storyImageEditorTop small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:rgba(255,255,255,.55);font-size:8px}.storyImageEditorTop>b{min-width:42px;padding:5px 7px;border-radius:999px;background:rgba(215,104,142,.18);color:#f0a1b9;text-align:center;font-size:9px}.storyImageFilters{display:flex;gap:7px;padding:1px 2px 9px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none}.storyImageFilters::-webkit-scrollbar{display:none}.storyImageFilters button{flex:0 0 54px;padding:3px 3px 5px;border:1px solid transparent;border-radius:13px;display:grid;gap:4px;background:transparent;color:rgba(255,255,255,.68);scroll-snap-align:start}.storyImageFilters button>span{width:46px;height:42px;border-radius:10px;display:block;background-position:center;background-size:cover;filter:var(--filter);box-shadow:0 4px 12px rgba(0,0,0,.2)}.storyImageFilters button small{font-size:7.5px}.storyImageFilters button.active{border-color:#df7d9e;background:rgba(210,93,133,.16);color:#fff}.storyImageEditorActions{display:grid;grid-template-columns:1fr 1.35fr;gap:7px}.storyImageEditorActions button{height:37px;border:0;border-radius:12px;background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:10px;font-weight:780}.storyImageEditorActions #storyImageDone{background:linear-gradient(135deg,#c45b7e,#df829e)}
.storyPlaybackTextCanvas{z-index:5}.storyPlaybackText{pointer-events:none}
.storyMusicTimelineLabels{display:grid!important;grid-template-columns:1fr auto 1fr!important;align-items:center!important}.storyMusicTimelineLabels>span:last-child{text-align:right}.storyMusicBufferLabel{min-width:86px;padding:4px 7px;border-radius:999px;background:rgba(125,161,174,.12);color:#6f8992!important;text-align:center!important;font-size:8.5px;font-weight:750;font-variant-numeric:tabular-nums}.storyMusicRangeTrack.is-buffering .storyMusicBufferLabel{color:#537680}.storyMusicWaveform.buffered{z-index:1;clip-path:polygon(0 0,var(--buffer-end) 0,var(--buffer-end) 100%,0 100%)}.storyMusicWaveform.buffered i{background:#8fc3d0;opacity:.82}.storyMusicWaveform.selected{z-index:2;clip-path:polygon(var(--clip-start) 0,var(--clip-end) 0,var(--clip-end) 100%,var(--clip-start) 100%)}.storyMusicWaveform.selected i{background:#d66e91;opacity:.76}.storyMusicWaveform.played{z-index:3;clip-path:polygon(var(--clip-start) 0,var(--playhead) 0,var(--playhead) 100%,var(--clip-start) 100%)}.storyMusicWaveform.played i{background:#8f3157;opacity:1}.storyMusicWaveform.base{z-index:0}.storyMusicWaveform.base i{background:#cdb4bc}.storyMusicPlayhead{position:absolute;z-index:6;left:var(--playhead);top:0;width:44px;height:72px;padding:0;border:0;background:transparent;transform:translateX(-50%);touch-action:none}.storyMusicPlayhead>span{display:block;width:3px;height:54px;margin:auto;border-radius:999px;background:#fff;box-shadow:0 0 0 2px #9d385e,0 3px 10px rgba(68,23,40,.42)}.storyMusicPlaybackLabels{display:flex;justify-content:space-between;padding:2px 3px 0;color:#a17b88;font-size:9.5px}.storyMusicPlaybackLabels b{color:#633e4c;font-variant-numeric:tabular-nums}
.storyMusicRangeTrack.is-scrubbing-start .storyMusicPlayhead>span{box-shadow:0 0 0 2px #9d385e,0 3px 10px rgba(68,23,40,.42),0 0 0 7px rgba(157,56,94,.1)}
.storyMusicMix label{position:relative}.storyMusicMix input[type="range"]{width:100%;height:44px!important;margin:-9px 0!important;appearance:none;-webkit-appearance:none;background:linear-gradient(90deg,#c45a7e 0 var(--range-value),#e4cfd5 var(--range-value) 100%) center/100% 5px no-repeat!important;touch-action:none}.storyMusicMix input[type="range"]::-webkit-slider-runnable-track{height:5px;background:transparent}.storyMusicMix input[type="range"]::-webkit-slider-thumb{width:24px;height:24px;margin-top:-9.5px;border:3px solid #fff;border-radius:50%;appearance:none;-webkit-appearance:none;background:#c45a7e;box-shadow:0 3px 10px rgba(96,37,58,.3)}.storyMusicMix input[type="range"]::-moz-range-track{height:5px;background:transparent}.storyMusicMix input[type="range"]::-moz-range-thumb{width:20px;height:20px;border:3px solid #fff;border-radius:50%;background:#c45a7e;box-shadow:0 3px 10px rgba(96,37,58,.3)}
.storyMusicPlay,.storyMusicPopularPlay{--load-progress:4%;position:relative;isolation:isolate;transition:transform .12s ease,filter .16s ease}.storyMusicPlay:active,.storyMusicPopularPlay:active{transform:scale(.88)!important}.storyMusicPlay.is-loading::before,.storyMusicPopularPlay.is-loading::before{content:"";position:absolute;z-index:3;inset:-4px;border-radius:50%;background:conic-gradient(#f08caf var(--load-progress),rgba(201,91,128,.16) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 0);mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 0);animation:storyLoadRing .85s linear infinite}.storyMusicPlay.is-loading .uiIcon,.storyMusicPopularPlay.is-loading .uiIcon{opacity:.62}@keyframes storyLoadRing{to{transform:rotate(360deg)}}
.storyComposerMusicStatus{border:0;text-align:left}.storyComposerMusicStatus .storyMusicButtonIcon{position:relative;width:28px;height:28px;flex:0 0 28px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#dc7597,#a94469);color:#fff}.storyComposerMusicStatus .storyMusicButtonIcon .uiIcon{width:13px;height:13px}.storyComposerMusicStatus.is-loading .storyMusicButtonIcon::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid transparent;border-top-color:#f7aac0;border-right-color:#d9688f;animation:storyLoadRing .8s linear infinite}

@media (min-width:760px){
  .storyComposerStage{margin:18px 18px 0;border-radius:24px;}.storyComposerDock{padding-left:max(18px,calc((100vw - 920px)/2));padding-right:max(18px,calc((100vw - 920px)/2));}.storyMusicPanel{bottom:18px;border-bottom:1px solid rgba(255,255,255,.11)!important;border-radius:28px!important}.storyComposerMusicStatus{left:36px}.storyComposerLifetime{right:36px}
}
@media (max-width:620px){
  .storyComposerModal .modal-header{height:calc(60px + env(safe-area-inset-top));padding-top:calc(9px + env(safe-area-inset-top))!important}.storyComposerModal #modalClose{left:12px;bottom:7px;width:39px;height:39px}.storyComposerModal .modal-actions{right:12px;top:calc(9px + env(safe-area-inset-top))}.storyComposerPublish{min-height:39px;padding:0 14px;font-size:11.5px}
  .storyComposerDock{grid-template-columns:132px minmax(0,1fr);gap:8px;padding:9px 10px calc(9px + env(safe-area-inset-bottom))}.storyMusicToggle,.storyComposerCaption,.storyTextAdd{height:50px!important;min-height:50px!important;border-radius:16px!important}.storyMusicToggle{padding:6px 8px!important}.storyMusicToggleIcon,.storyTextAddIcon{width:34px!important;height:34px!important;flex-basis:34px!important}.storyMusicToggle small,.storyTextAdd small{display:none}.storyComposerMusicStatus{left:10px;bottom:10px;max-width:66vw}.storyComposerLifetime{right:10px;bottom:10px;padding:6px 8px}.storyMusicPanel{height:min(82dvh,760px);border-radius:25px 25px 0 0!important}.storyMusicSheetScroll{padding-left:12px;padding-right:12px}.storyMusicPopularCard{grid-template-columns:104px minmax(0,1fr)!important;min-height:142px!important;padding:10px!important}.storyMusicPopularCard>img,.storyMusicPopularCard>.storyMusicArtworkFallback{width:104px!important;height:104px!important}.storyMusicPopularPlay{left:43px!important;top:43px!important;width:42px!important;height:42px!important}.storyMusicPopularAdd{right:11px!important;bottom:12px!important;width:32px!important;height:32px!important}.storyMusicMix{grid-template-columns:1fr!important}.storyMusicFragmentSummary{align-items:flex-start!important;flex-direction:column!important}.storyMusicAppliedActions{grid-template-columns:1fr 100px!important}
}
@media (orientation:landscape) and (max-height:560px){
  .storyComposerDock{position:absolute;left:12px;right:12px;bottom:calc(8px + env(safe-area-inset-bottom));padding:8px;border:1px solid rgba(255,255,255,.1);border-radius:20px;background:rgba(18,13,16,.76);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.storyComposerStage{height:100%;}.storyComposerMusicStatus,.storyComposerLifetime{bottom:82px}.storyMusicPanel{height:94dvh;width:min(680px,82vw);border-radius:24px!important;bottom:3dvh;border-bottom:1px solid rgba(255,255,255,.11)!important}
}
@media (prefers-reduced-motion:reduce){.storyMusicPanel{animation:none}.storyMusicToggle:active{transform:none}}

/* DiValis 2.33.12 — unified story music library. */
.storyViewer{
  --story-swipe-x:0px;--story-swipe-y:0px;--story-swipe-scale:1;--story-swipe-radius:0px;
  transform:translate3d(var(--story-swipe-x),var(--story-swipe-y),0) scale(var(--story-swipe-scale));
  transform-origin:center top;border-radius:var(--story-swipe-radius);will-change:transform,border-radius;
}
.storyViewer.gesture-following{transition:none!important;box-shadow:0 -10px 55px rgba(0,0,0,.42)}
.storyViewer.gesture-settling{transition:transform .185s cubic-bezier(.2,.78,.2,1),border-radius .185s ease!important;box-shadow:0 -10px 55px rgba(0,0,0,.42)}
.fullScreenMediaViewer.viewerGestureFollowing,.fullScreenMediaViewer.viewerGestureSettling{
  transform:translate3d(0,var(--viewer-dismiss-y,0px),0) scale(var(--viewer-dismiss-scale,1))!important;
  transform-origin:center top;will-change:transform;border-radius:22px!important;overflow:hidden!important;
}

/* Music library */
.musicHub{position:fixed;inset:0;z-index:4700;display:grid;place-items:stretch;overflow:hidden;color:#5d3545;background:#f7e8e2;opacity:0;transform:translateY(16px) scale(.994);transition:opacity .22s ease,transform .28s cubic-bezier(.2,.8,.2,1)}
.musicHub.hidden{display:none!important}.musicHub.open{opacity:1;transform:none}.musicHubBackdrop{position:absolute;inset:-15%;background:radial-gradient(circle at 12% 6%,rgba(255,249,219,.92),transparent 34%),radial-gradient(circle at 90% 18%,rgba(235,151,176,.33),transparent 35%),radial-gradient(circle at 45% 100%,rgba(203,110,144,.2),transparent 45%),linear-gradient(160deg,#fff7ea 0%,#f8e5df 48%,#f2d8df 100%)}
.musicHubBackdrop::before,.musicHubBackdrop::after{content:"";position:absolute;border-radius:50%;filter:blur(2px);opacity:.36}.musicHubBackdrop::before{width:38vmax;height:38vmax;right:-16vmax;top:-15vmax;border:1px solid rgba(183,75,112,.28);box-shadow:0 0 0 42px rgba(255,255,255,.12),0 0 0 95px rgba(183,75,112,.045)}.musicHubBackdrop::after{width:28vmax;height:28vmax;left:-13vmax;bottom:-12vmax;border:1px solid rgba(222,153,91,.25);box-shadow:0 0 0 58px rgba(255,255,255,.1)}
.musicHubShell{position:relative;width:min(100%,920px);height:100%;min-height:0;margin:0 auto;display:grid;grid-template-rows:auto auto auto minmax(0,1fr) auto;padding-top:env(safe-area-inset-top);background:rgba(255,250,245,.54);box-shadow:0 0 70px rgba(102,47,66,.12);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.musicHubHeader{min-height:74px;padding:10px max(18px,env(safe-area-inset-right)) 8px max(18px,env(safe-area-inset-left));display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:12px}.musicRoundButton{width:44px;height:44px;padding:0;border:1px solid rgba(135,71,93,.14);border-radius:16px;display:grid;place-items:center;background:rgba(255,255,255,.7);color:#744258;box-shadow:0 9px 25px rgba(103,48,67,.08);cursor:pointer}.musicRoundButton:active{transform:scale(.94)}.musicRoundButton .uiIcon{width:21px;height:21px}.musicHubHeading{display:grid;justify-items:center;line-height:1}.musicHubHeading span{font-size:9px;font-weight:850;letter-spacing:.22em;text-transform:uppercase;color:#c06484}.musicHubHeading strong{margin-top:5px;font:700 29px/1 Georgia,"Times New Roman",serif;letter-spacing:.015em;color:#6f354c}.musicHeaderPulse{height:28px;display:flex;align-items:center;justify-content:center;gap:3px}.musicHeaderPulse i{width:3px;border-radius:4px;background:linear-gradient(#df7594,#9d4667);animation:musicPulse 1.15s ease-in-out infinite}.musicHeaderPulse i:nth-child(1){height:10px}.musicHeaderPulse i:nth-child(2){height:22px;animation-delay:-.28s}.musicHeaderPulse i:nth-child(3){height:15px;animation-delay:-.55s}@keyframes musicPulse{0%,100%{transform:scaleY(.55);opacity:.55}50%{transform:scaleY(1);opacity:1}}
.musicSearch{height:52px;margin:2px max(18px,env(safe-area-inset-right)) 12px max(18px,env(safe-area-inset-left));padding:0 13px;display:flex;align-items:center;gap:10px;border:1px solid rgba(154,79,106,.14);border-radius:19px;background:rgba(255,255,255,.77);box-shadow:0 12px 32px rgba(102,48,67,.065)}.musicSearch>.uiIcon{width:20px;height:20px;flex:none;color:#b45c7a}.musicSearch input{height:100%;min-width:0;flex:1;border:0;outline:0;background:transparent;color:#5e3545;font:650 15px/1.2 inherit;-webkit-appearance:none}.musicSearch input::placeholder{color:#aa8793;font-weight:550}.musicSearchClear{width:32px;height:32px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:#f3e2e5;color:#8a4d63}.musicSearchClear .uiIcon{width:15px;height:15px}
.musicTabs{padding:0 max(18px,env(safe-area-inset-right)) 13px max(18px,env(safe-area-inset-left));display:flex;gap:7px;overflow-x:auto;scrollbar-width:none}.musicTabs::-webkit-scrollbar{display:none}.musicTabs button{height:34px;padding:0 15px;border:1px solid rgba(143,76,99,.12);border-radius:999px;flex:none;background:rgba(255,255,255,.52);color:#906477;font:750 12px/1 inherit;white-space:nowrap}.musicTabs button.active{border-color:transparent;background:linear-gradient(135deg,#d96589,#ad496d);color:#fff;box-shadow:0 7px 17px rgba(169,67,103,.22)}
.musicSearchTabs{position:sticky;top:-4px;z-index:3;margin:0 0 16px;padding:5px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;border:1px solid rgba(143,76,99,.11);border-radius:18px;background:rgba(255,247,243,.9);box-shadow:0 8px 24px rgba(102,48,67,.06);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.musicSearchTabs button{height:38px;padding:0 10px;border:0;border-radius:13px;background:transparent;color:#9a6d7d;font:750 11.5px/1 inherit}.musicSearchTabs button.active{background:#fff;color:#a64568;box-shadow:0 5px 15px rgba(105,45,67,.09)}
.musicEntity.artist .musicEntityArt{border-radius:50%}
.musicHubContent{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:4px max(18px,env(safe-area-inset-right)) 26px max(18px,env(safe-area-inset-left));scrollbar-color:rgba(168,80,111,.25) transparent}.musicSection{margin:6px 0 25px}.musicSectionHeader{min-height:34px;padding:0 3px 9px;display:flex;align-items:end;justify-content:space-between;gap:12px}.musicSectionHeader strong{font:700 21px/1.1 Georgia,"Times New Roman",serif;color:#6e3e50}.musicSectionHeader span{color:#ab7f8e;font-size:10.5px}.musicHero{position:relative;min-height:168px;margin-bottom:22px;padding:26px 24px;border:1px solid rgba(255,255,255,.58);border-radius:30px;overflow:hidden;display:flex;flex-direction:column;justify-content:end;background:linear-gradient(135deg,rgba(107,49,75,.96),rgba(180,69,109,.88) 58%,rgba(225,135,113,.9));color:#fff;box-shadow:0 22px 50px rgba(113,49,76,.17)}.musicHero::before{content:"";position:absolute;width:260px;height:260px;border:45px solid rgba(255,255,255,.08);border-radius:50%;right:-90px;top:-100px}.musicHero::after{content:"♪";position:absolute;right:31px;bottom:11px;font:700 92px/1 Georgia,serif;color:rgba(255,255,255,.1);transform:rotate(8deg)}.musicHero>*{position:relative;z-index:1}.musicHero small{font-size:10px;font-weight:850;letter-spacing:.17em;text-transform:uppercase;color:#ffd7e2}.musicHero strong{max-width:520px;margin-top:7px;font:700 28px/1.08 Georgia,"Times New Roman",serif}.musicHero span{max-width:520px;margin-top:9px;font-size:12px;line-height:1.45;color:rgba(255,255,255,.76)}
.musicTrackList{display:grid;gap:7px}.musicTrack{width:100%;min-height:69px;padding:7px 9px 7px 7px;border:1px solid rgba(151,79,104,.1);border-radius:20px;display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:11px;background:rgba(255,255,255,.59);color:inherit;text-align:left;box-shadow:0 6px 20px rgba(97,50,67,.045);transition:transform .15s ease,background .15s ease,border-color .15s ease;cursor:pointer}.musicTrack:active{transform:scale(.988)}.musicTrack.active{border-color:rgba(190,73,112,.3);background:rgba(255,249,248,.92);box-shadow:0 11px 28px rgba(141,56,88,.11)}.musicTrackArt,.musicPlayerArtwork,.musicMiniArtwork,.musicEntityArt{position:relative;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#f1c4ce,#bd5b7d);color:#fff}.musicTrackArt{width:54px;height:54px;border-radius:15px}.musicTrackArt img,.musicPlayerArtwork img,.musicMiniArtwork img,.musicEntityArt img{width:100%;height:100%;object-fit:cover}.musicTrackArt .uiIcon{width:22px;height:22px}.musicTrack.active .musicTrackArt::after{content:"";position:absolute;inset:0;background:rgba(92,29,52,.35)}.musicTrackPlaying{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;gap:2px}.musicTrackPlaying i{width:2px;height:14px;border-radius:3px;background:#fff;animation:musicPulse .75s ease-in-out infinite}.musicTrackPlaying i:nth-child(2){animation-delay:-.3s;height:21px}.musicTrackPlaying i:nth-child(3){animation-delay:-.5s;height:11px}.musicTrackMeta{min-width:0;display:grid;gap:4px}.musicTrackMeta strong,.musicTrackMeta small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicTrackMeta strong{font-size:13.5px;color:#623b4b}.musicTrackMeta small{font-size:10.5px;color:#a17b89}.musicTrackDuration{font-variant-numeric:tabular-nums;color:#aa8390;font-size:10px;padding-right:4px}.musicTrackAction{width:35px;height:35px;border:0;border-radius:50%;display:grid;place-items:center;background:#f2dfe4;color:#a94f70}.musicTrackAction .uiIcon{width:17px;height:17px}
.musicLoadMore{width:min(100%,420px);min-height:54px;margin:15px auto 2px;padding:8px 18px;border:1px solid rgba(170,78,109,.16);border-radius:18px;display:grid;grid-template-columns:24px auto;grid-template-rows:auto auto;align-items:center;justify-content:center;column-gap:10px;background:linear-gradient(145deg,rgba(255,255,255,.88),rgba(250,228,235,.76));color:#7b4459;box-shadow:0 9px 25px rgba(103,48,67,.08)}.musicLoadMore>span{grid-row:1/3;width:20px;height:20px;border:2px solid rgba(181,78,114,.18);border-top-color:#bf577b;border-radius:50%;opacity:0}.musicLoadMore strong{font-size:12.5px}.musicLoadMore small{font-size:9px;color:#ad7d8e}.musicLoadMore:active{transform:scale(.985)}.musicLoadMore.loading>span{opacity:1;animation:musicSpin .75s linear infinite}.musicLoadMore:disabled{opacity:.72}
.musicEntityGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.musicEntity{min-width:0;padding:10px;border:1px solid rgba(151,79,104,.1);border-radius:22px;display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:11px;background:rgba(255,255,255,.57);color:#633c4c;text-align:left}.musicEntity:active{transform:scale(.985)}.musicEntityArt{width:54px;height:54px;border-radius:18px;font:800 18px/1 inherit}.musicEntity.album .musicEntityArt{border-radius:13px}.musicEntity span{min-width:0;display:grid;gap:4px}.musicEntity strong,.musicEntity small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicEntity strong{font-size:13px}.musicEntity small{font-size:10px;color:#aa7f8d}.musicGenreGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.musicGenre{position:relative;height:92px;padding:15px;border:0;border-radius:22px;overflow:hidden;display:flex;align-items:flex-end;background:var(--genre-gradient);color:#fff;text-align:left;box-shadow:0 10px 26px rgba(102,46,67,.11)}.musicGenre::after{content:"♪";position:absolute;right:11px;top:-8px;font:700 65px/1 Georgia,serif;color:rgba(255,255,255,.2);transform:rotate(12deg)}.musicGenre strong{position:relative;z-index:1;font-size:15px}.musicLoading,.musicEmpty{min-height:230px;padding:34px 20px;display:grid;place-items:center;align-content:center;gap:13px;text-align:center;color:#9d7483}.musicLoading span{width:34px;height:34px;border:3px solid rgba(183,75,112,.14);border-top-color:#c45d80;border-radius:50%;animation:musicSpin .8s linear infinite}@keyframes musicSpin{to{transform:rotate(360deg)}}.musicEmpty .uiIcon{width:42px;height:42px;color:#bd6684}.musicEmpty strong{font:700 20px/1.1 Georgia,"Times New Roman",serif;color:#704457}.musicEmpty p{max-width:340px;margin:0;font-size:12px;line-height:1.5}
.musicArtistMatches{margin-bottom:18px}.musicArtistMatchList{display:flex;gap:10px;overflow-x:auto;padding:1px 2px 6px;scroll-snap-type:x proximity;scrollbar-width:none}.musicArtistMatchList::-webkit-scrollbar{display:none}.musicArtistMatch{min-width:min(360px,82vw);max-width:420px;min-height:82px;padding:10px 12px 10px 10px;border:1px solid rgba(151,79,104,.11);border-radius:24px;display:grid;grid-template-columns:62px minmax(0,1fr) 22px;align-items:center;gap:12px;scroll-snap-align:start;background:linear-gradient(135deg,rgba(255,255,255,.88),rgba(253,237,239,.7));color:#633c4c;text-align:left;box-shadow:0 9px 25px rgba(97,50,67,.06)}.musicArtistMatch:active{transform:scale(.985)}.musicSearchArtistArt{position:relative;width:62px;height:62px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#f1c4ce,#bd5b7d);color:#fff;box-shadow:0 5px 16px rgba(112,52,75,.16)}.musicSearchArtistArt img{position:absolute;inset:0;z-index:1;width:100%;height:100%;object-fit:cover}.musicSearchArtistArt>.uiIcon{position:relative;z-index:0;width:24px;height:24px}.musicArtistMatch>span:nth-child(2){min-width:0;display:grid;gap:5px}.musicArtistMatch strong,.musicArtistMatch small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicArtistMatch strong{font:700 17px/1.1 Georgia,"Times New Roman",serif}.musicArtistMatch small{font-size:10px;color:#a77d8b}.musicArtistMatch>.uiIcon{width:18px;height:18px;color:#bd6684}.musicSearchHint{min-height:180px}
.musicPlayer{position:relative;min-height:108px;padding:10px max(18px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left));border-top:1px solid rgba(141,76,98,.12);display:grid;grid-template-columns:minmax(190px,1fr) minmax(160px,1.4fr) auto;align-items:center;gap:17px;background:rgba(255,250,246,.9);box-shadow:0 -15px 40px rgba(99,48,67,.07);backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px)}.musicPlayer.hidden{display:none!important}.musicPlayerTrack{min-width:0;padding:0;border:0;display:flex;align-items:center;gap:11px;background:transparent;color:inherit;text-align:left}.musicPlayerArtwork{width:56px;height:56px;flex:0 0 56px;border-radius:17px}.musicPlayerArtwork .uiIcon{width:22px;height:22px}.musicPlayerMeta{min-width:0;display:grid;gap:4px}.musicPlayerMeta strong,.musicPlayerMeta small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicPlayerMeta strong{font-size:13px;color:#5d3545}.musicPlayerMeta small{font-size:10.5px;color:#a47c8a}.musicPlayerTimeline{min-width:0;display:grid;gap:4px}.musicPlayerTimeline input{width:100%;height:24px;margin:0;accent-color:#bd5479;touch-action:none}.musicPlayerTimes{display:flex;justify-content:space-between;font-size:9px;color:#aa8290;font-variant-numeric:tabular-nums}.musicPlayerControls{display:flex;align-items:center;gap:7px}.musicControl{width:39px;height:39px;padding:0;border:1px solid rgba(145,77,101,.12);border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.7);color:#8d4a63}.musicControl.primary{position:relative;width:49px;height:49px;border:0;background:linear-gradient(145deg,#db6d8f,#ad496e);color:#fff;box-shadow:0 8px 20px rgba(169,66,102,.24)}.musicControl .uiIcon{width:18px;height:18px}.musicControl.primary .uiIcon{width:21px;height:21px}.musicControl:active{transform:scale(.92)}.musicControl.loading .uiIcon{opacity:.2}.musicControlSpinner{display:none;position:absolute;inset:5px;border:2px solid rgba(255,255,255,.32);border-top-color:#fff;border-radius:50%;animation:musicSpin .75s linear infinite}.musicControl.loading .musicControlSpinner{display:block}
.musicMiniPlayer{position:fixed;z-index:1050;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));width:min(calc(100% - 26px),560px);min-height:64px;padding:7px 8px;transform:translateX(-50%);border:1px solid rgba(255,255,255,.55);border-radius:22px;display:grid;grid-template-columns:minmax(0,1fr) 43px 43px;align-items:center;gap:4px;background:rgba(255,247,241,.9);box-shadow:0 17px 45px rgba(99,43,65,.22);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}.musicMiniPlayer.hidden{display:none!important}.musicMiniTrack{min-width:0;padding:0;border:0;display:flex;align-items:center;gap:10px;background:transparent;color:inherit;text-align:left}.musicMiniArtwork{width:48px;height:48px;flex:0 0 48px;border-radius:15px}.musicMiniArtwork .uiIcon{width:20px;height:20px}.musicMiniTrack>span:last-child{min-width:0;display:grid;gap:3px}.musicMiniTrack strong,.musicMiniTrack small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicMiniTrack strong{font-size:12.5px;color:#633b4b}.musicMiniTrack small{font-size:9.5px;color:#a77e8c}.musicMiniAction{width:39px;height:39px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:#efdce2;color:#9d4b69}.musicMiniAction .uiIcon{width:18px;height:18px}
.musicSystemAudio{position:fixed;left:0;bottom:0;width:2px;height:2px;opacity:.001;pointer-events:none;z-index:-1}
body.music-hub-open{overflow:hidden;touch-action:none}body.music-hub-open .musicMiniPlayer{display:none!important}
/* Music lives in its own full-screen stacking context (4700 normally and
   7000 in the mobile expanded player). Dialogs opened from that surface must
   stay above it; otherwise the tap succeeds but the dialog only becomes
   visible after the player is collapsed. */
body.music-hub-open .modal-overlay:not(.hidden){z-index:7600!important}
@media(max-width:650px){.musicHubShell{width:100%;background:rgba(255,250,245,.62)}.musicHubHeader{min-height:66px;padding-top:7px}.musicHubHeading strong{font-size:25px}.musicSearch{height:48px;margin-bottom:10px}.musicHubContent{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right));padding-bottom:18px}.musicHero{min-height:145px;margin-bottom:17px;padding:21px 18px;border-radius:25px}.musicHero strong{font-size:23px}.musicTrack{min-height:65px;grid-template-columns:50px minmax(0,1fr) auto;border-radius:18px}.musicTrackArt{width:50px;height:50px;border-radius:14px}.musicEntityGrid{grid-template-columns:1fr}.musicGenreGrid{gap:8px}.musicGenre{height:82px;border-radius:19px}.musicPlayer{min-height:136px;padding-top:9px;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"track controls" "timeline timeline";gap:5px 10px}.musicPlayerTrack{grid-area:track}.musicPlayerTimeline{grid-area:timeline}.musicPlayerControls{grid-area:controls}.musicPlayerArtwork{width:49px;height:49px;flex-basis:49px;border-radius:15px}.musicControl{width:36px;height:36px}.musicControl.primary{width:45px;height:45px}.musicTabs{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}.musicSearch{margin-left:max(12px,env(safe-area-inset-left));margin-right:max(12px,env(safe-area-inset-right))}}
@media(prefers-reduced-motion:reduce){.musicHeaderPulse i,.musicTrackPlaying i,.musicLoading span,.musicControlSpinner{animation-duration:.01ms!important;animation-iteration-count:1!important}}
.musicTrackArt img,.musicPlayerArtwork img,.musicMiniArtwork img,.musicEntityArt img{position:absolute;inset:0;z-index:1}.musicTrackArt>.uiIcon,.musicPlayerArtwork>.uiIcon,.musicMiniArtwork>.uiIcon,.musicEntityArt>.uiIcon{position:relative;z-index:0}.musicTrack.active .musicTrackArt::after{z-index:2}
.fullScreenMediaViewer.viewerGestureFollowing{transition:none!important;box-shadow:0 -16px 70px rgba(0,0,0,.5)!important}
.fullScreenMediaViewer.viewerGestureSettling{transition:transform .19s cubic-bezier(.2,.78,.2,1),border-radius .19s ease!important;box-shadow:0 -16px 70px rgba(0,0,0,.5)!important}
@media (prefers-reduced-motion:reduce){
  .storyViewer.gesture-settling,.fullScreenMediaViewer.viewerGestureSettling,.storyMusicPanel.gesture-settling{transition-duration:.01ms!important}
}

/* The entire timeline is a generous touch target; the thumb only visualizes
   the pending position and does not need to be hit directly. */
.musicPlayerTimeline input{--music-progress:0%;width:100%;height:34px;margin:-5px 0;padding:0;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;touch-action:none}
.musicPlayerTimeline input::-webkit-slider-runnable-track{height:4px;border-radius:999px;background:linear-gradient(90deg,#c5527a 0 var(--music-progress),rgba(154,101,120,.2) var(--music-progress) 100%)}
.musicPlayerTimeline input::-webkit-slider-thumb{width:18px;height:18px;margin-top:-7px;border:3px solid #fff;border-radius:50%;appearance:none;-webkit-appearance:none;background:#c5527a;box-shadow:0 2px 9px rgba(111,45,70,.28)}
.musicPlayerTimeline input::-moz-range-track{height:4px;border:0;border-radius:999px;background:rgba(154,101,120,.2)}
.musicPlayerTimeline input::-moz-range-progress{height:4px;border-radius:999px;background:#c5527a}
.musicPlayerTimeline input::-moz-range-thumb{width:14px;height:14px;border:3px solid #fff;border-radius:50%;background:#c5527a;box-shadow:0 2px 9px rgba(111,45,70,.28)}
.musicSystemAudio{width:1px;height:1px;opacity:.01;z-index:0;overflow:hidden}

.musicHubShell{grid-template-rows:auto auto minmax(0,1fr) auto}
.musicHubContent{padding-top:8px}

/* DiValis 2.33.12 — compact chat chrome and primary mobile navigation. */
.conversationScopes{
  gap:3px;
  margin-bottom:5px;
  padding:2px;
  border-radius:11px;
}
.conversationScope{
  min-height:25px;
  border-radius:8px;
  font-size:10.5px;
  line-height:1;
}
.conversationScope span:not(:empty){min-width:15px;height:15px;padding:0 4px;font-size:8.5px;}
.appSectionNav{display:none;}

@media (max-width:720px){
  .appSectionNav{
    position:fixed;
    z-index:4800;
    left:max(8px,env(safe-area-inset-left));
    right:max(8px,env(safe-area-inset-right));
    bottom:max(7px,env(safe-area-inset-bottom));
    min-height:58px;
    padding:5px;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:4px;
    border:1px solid rgba(255,255,255,.7);
    border-radius:22px;
    background:rgba(255,248,244,.88);
    box-shadow:0 15px 42px rgba(91,43,61,.2);
    backdrop-filter:blur(24px) saturate(1.15);
    -webkit-backdrop-filter:blur(24px) saturate(1.15);
  }
  .appSectionNav button{
    min-width:0;
    min-height:48px;
    padding:5px 8px 4px;
    border:0;
    border-radius:17px;
    display:grid;
    place-items:center;
    align-content:center;
    gap:3px;
    background:transparent;
    color:#98727f;
    font:inherit;
    font-size:9px;
    font-weight:780;
    transition:transform .13s ease,background .18s ease,color .18s ease,box-shadow .18s ease;
  }
  .appSectionNav button .uiIcon{width:20px;height:20px;}
  .appSectionNav button.active{
    color:#fff;
    background:linear-gradient(145deg,#d87191,#ad496d);
    box-shadow:0 7px 17px rgba(166,65,101,.22);
  }
  .appSectionNav button:active{transform:scale(.94);}
  .app.mobile-chat .appSectionNav,
  .app.mobile-chat ~ .appSectionNav,
  body.story-viewer-open .appSectionNav,
  body.story-composer-open .appSectionNav{display:none;}
  /* A chat stays mounted beneath music opened from a shared track. Restore
     the app navigation above the compact player when that music is visible. */
  body.music-hub-open:not(.music-player-expanded) .app.mobile-chat ~ .appSectionNav{display:grid;}
  .sidebar > .list{padding-bottom:calc(82px + env(safe-area-inset-bottom));}
  .storiesHubContent{padding-bottom:calc(90px + env(safe-area-inset-bottom));}
  .musicHubShell{padding-bottom:calc(68px + env(safe-area-inset-bottom));}
  .musicMiniPlayer{bottom:calc(78px + env(safe-area-inset-bottom));}
  .storiesTray{padding-top:0;padding-bottom:6px;}
  .storiesHeading{padding-bottom:5px;}
  .search{padding-top:3px;padding-bottom:7px;}
}

/* Primary navigation belongs to the app, not to an individual screen. */
.musicMiniPlayer{display:none!important;}
.musicTrack{position:relative;overflow:hidden;}
.musicTrack.active{
  border-color:rgba(174,54,96,.46);
  background:linear-gradient(105deg,rgba(255,246,247,.98),rgba(249,222,230,.9));
  box-shadow:0 13px 30px rgba(139,51,84,.16),inset 0 0 0 1px rgba(255,255,255,.55);
  transform:translateX(2px);
}
.musicTrack.active::before{
  content:"";position:absolute;left:0;top:10px;bottom:10px;width:4px;border-radius:0 999px 999px 0;
  background:linear-gradient(180deg,#e07595,#a83f68);box-shadow:0 0 14px rgba(190,69,108,.35);
}
.musicTrack.active .musicTrackMeta strong{color:#8e3156;font-weight:850;}
.musicTrack.active .musicTrackMeta small,.musicTrack.active .musicTrackDuration{color:#864d63;font-weight:720;}
.musicTrack.liveRecommendation{border-color:rgba(191,121,62,.24);background:linear-gradient(105deg,rgba(255,252,245,.94),rgba(252,235,223,.78));}
.musicTrackMeta small i{display:inline-flex;margin-left:6px;padding:2px 6px;border-radius:999px;background:rgba(191,121,62,.13);color:#9b6544;font-size:8px;font-style:normal;font-weight:800;letter-spacing:.02em;vertical-align:1px;}

@media (max-width:720px){
  .musicHubShell{padding-bottom:calc(66px + env(safe-area-inset-bottom));}
  .musicHubContent{padding-bottom:10px;}
  .musicPlayer{
    min-height:88px;
    padding:5px max(12px,env(safe-area-inset-right)) 6px max(12px,env(safe-area-inset-left));
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"track controls" "timeline timeline";
    gap:2px 8px;
  }
  .musicPlayerTrack{min-height:42px;gap:9px;}
  .musicPlayerArtwork{width:42px;height:42px;flex-basis:42px;border-radius:13px;}
  .musicPlayerMeta{gap:2px;}
  .musicPlayerMeta strong{font-size:12.5px;}
  .musicPlayerMeta small{font-size:9.5px;}
  .musicPlayerControls{gap:4px;}
  .musicControl{width:32px;height:32px;}
  .musicControl.primary{width:40px;height:40px;}
  .musicControl .uiIcon{width:16px;height:16px;}
  .musicControl.primary .uiIcon{width:19px;height:19px;}
  .musicPlayerTimeline{gap:0;}
  .musicPlayerTimeline input{height:27px;margin:-6px 0 -4px;}
  .musicPlayerTimes{font-size:8.5px;line-height:1;}
}

/* Final responsive overrides for the personal music surfaces. */
.musicHubShell{grid-template-rows:auto auto minmax(0,1fr) auto}
.musicCollectionGrid .musicCollectionCard{grid-template-columns:94px minmax(0,1fr)}
@media(max-width:650px){
  .musicCollectionGrid .musicCollectionCard{grid-template-columns:88px minmax(0,1fr)}
}
@media(max-height:620px) and (orientation:portrait){
  .musicNowHeader{min-height:54px;padding-top:5px;padding-bottom:3px}
  .musicNowBody{padding-top:1px;gap:5px;grid-template-rows:minmax(112px,1fr) auto auto auto auto}
  .musicNowArtwork{width:min(30vh,58vw,210px)}
  .musicNowIdentity{gap:1px}.musicNowIdentity strong{font-size:19px}
  .musicNowTimeline input{height:30px}
  .musicNowControl{width:42px;height:42px}.musicNowControl.primary{width:58px;height:58px}
  .musicNowActions button{min-height:40px}.musicNowControls{gap:20px}
}

/* Expanded music is a true full-screen listening surface. */
.musicRoundButton.musicHomeBack{visibility:hidden;pointer-events:none}
.musicHub.player-expanded{overflow:clip}
.musicHub.player-expanded + .appSectionNav{display:none!important}
.musicHub.player-expanded .musicHubShell{padding-bottom:0!important}
.musicQueueGlyph{width:18px;height:16px;display:grid;align-content:center;gap:3px;font-size:0!important}
.musicQueueGlyph i{width:100%;height:2px;border-radius:999px;background:currentColor}
.musicQueueGlyph i:nth-child(2){width:72%}
@media(max-width:650px){
  .musicNowActions button{min-height:45px;flex-direction:column;gap:2px}
  .musicNowActions button strong{display:block;font-size:7.5px;line-height:1}
  .musicNowActions button>span{font-size:19px}
  .musicNowActions .musicQueueGlyph{width:17px;height:15px}
}

/* Premium transport surfaces: a clean seek line and a clearly docked mini player. */
.musicNowTimeline{width:100%;padding:0 2px;gap:1px}
.musicNowTimeline input{
  height:30px!important;
  margin:-3px 0 -2px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  outline:0!important;
}
.musicNowTimeline input:focus{border:0!important;background:transparent!important;box-shadow:none!important}
.musicNowTimeline input::-webkit-slider-runnable-track{
  height:4px;
  border:0;
  border-radius:999px;
  background:linear-gradient(90deg,#a73560 0 var(--music-progress),#dd7896 var(--music-progress),rgba(112,63,80,.2) var(--music-progress) 100%);
  box-shadow:inset 0 1px 2px rgba(79,35,52,.08);
}
.musicNowTimeline input::-webkit-slider-thumb{
  width:17px;
  height:17px;
  margin-top:-6.5px;
  border:3px solid #fffaf5;
  background:#bd456d;
  box-shadow:0 3px 10px rgba(93,35,57,.3),0 0 0 1px rgba(126,50,78,.08);
}
.musicNowTimeline input::-moz-range-track{height:4px;border:0;border-radius:999px;background:rgba(112,63,80,.2)}
.musicNowTimeline input::-moz-range-progress{height:4px;border-radius:999px;background:linear-gradient(90deg,#a73560,#dd7896)}
.musicNowTimeline input::-moz-range-thumb{width:13px;height:13px;border:3px solid #fffaf5;border-radius:50%;background:#bd456d;box-shadow:0 3px 10px rgba(93,35,57,.3)}
.musicNowTimeline>div{padding:0 1px;color:#84596a;font-size:9.5px;font-weight:720;line-height:1.1}

.musicPlayer{
  z-index:12;
  border:1px solid rgba(255,255,255,.58)!important;
  border-bottom:0!important;
  border-radius:23px 23px 0 0;
  background:linear-gradient(135deg,rgba(104,49,70,.98),rgba(166,68,105,.97))!important;
  box-shadow:0 -16px 38px rgba(80,31,50,.25),inset 0 1px 0 rgba(255,255,255,.22)!important;
  backdrop-filter:blur(26px) saturate(1.12);
  -webkit-backdrop-filter:blur(26px) saturate(1.12);
}
.musicPlayerMeta strong{color:#fffaf8!important}
.musicPlayerMeta small{color:rgba(255,244,247,.72)!important}
.musicPlayer .musicControl{border-color:rgba(255,255,255,.18)!important;background:rgba(255,255,255,.12)!important;color:#fff!important}
.musicPlayer .musicControl.primary{border:0!important;background:#fff7f2!important;color:#a13d63!important;box-shadow:0 7px 18px rgba(57,17,33,.28)!important}
.musicPlayerTimeline input{border:0!important;background:transparent!important;box-shadow:none!important;outline:0!important}
.musicPlayerTimeline input:focus{border:0!important;background:transparent!important;box-shadow:none!important}
.musicPlayerTimeline input::-webkit-slider-runnable-track{background:linear-gradient(90deg,#fff6f7 0 var(--music-progress),rgba(255,255,255,.24) var(--music-progress) 100%)}
.musicPlayerTimeline input::-webkit-slider-thumb{border-color:#7e3653;background:#fff;box-shadow:0 2px 9px rgba(45,15,27,.34)}
.musicPlayerTimes{color:rgba(255,244,247,.76)!important}
.musicCollectionCard.featured{width:100%}

/* DiValis 2.34.13 — catalog-linked stories, tactile player navigation and encrypted music cards. */
.modal-overlay.musicShareOverlay{z-index:5400!important}
.musicNowArtistLink{justify-self:center;max-width:min(100%,410px);min-height:34px;padding:3px 9px 3px 4px;border:0;border-radius:999px;display:grid;grid-template-columns:27px minmax(0,auto) 14px;align-items:center;gap:7px;background:rgba(255,255,255,.34);color:#8f6072;font:inherit;box-shadow:inset 0 0 0 1px rgba(125,67,87,.07);transition:background .18s ease,transform .18s ease,box-shadow .18s ease}
.musicNowArtistLink:active{transform:scale(.97);background:rgba(255,255,255,.62);box-shadow:inset 0 0 0 1px rgba(125,67,87,.12),0 5px 14px rgba(88,40,57,.08)}
.musicNowArtistLink:disabled{pointer-events:none;opacity:.65}
.musicNowArtistLink>span:nth-child(2){overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:700}
.musicNowArtistAvatar{position:relative;width:27px;height:27px;border-radius:50%;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#e9b7c5,#ba5e7d);color:#fff;box-shadow:0 3px 9px rgba(92,42,61,.15)}
.musicNowArtistAvatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.musicNowArtistAvatar .uiIcon{width:13px;height:13px}
.musicNowArtistArrow{width:12px!important;height:12px!important;opacity:.66}
.musicNowPlaying.musicNowTrackSwiping .musicNowBody{transform:translate3d(var(--music-track-x,0),0,0) rotate(var(--music-track-rotate,0));opacity:var(--music-track-opacity,1);transition:none;will-change:transform,opacity}
.musicNowPlaying.musicNowTrackSettling .musicNowBody{transform:translate3d(var(--music-track-x,0),0,0) rotate(var(--music-track-rotate,0));opacity:var(--music-track-opacity,1);transition:transform .2s cubic-bezier(.22,.74,.26,1),opacity .18s ease;will-change:transform,opacity}
.musicNowPlaying.musicNowTrackArriveRight .musicNowBody{animation:musicTrackArriveRight .25s cubic-bezier(.18,.76,.24,1)}
.musicNowPlaying.musicNowTrackArriveLeft .musicNowBody{animation:musicTrackArriveLeft .25s cubic-bezier(.18,.76,.24,1)}
@keyframes musicTrackArriveRight{from{transform:translate3d(22%,0,0) rotate(1.2deg);opacity:.2}to{transform:none;opacity:1}}
@keyframes musicTrackArriveLeft{from{transform:translate3d(-22%,0,0) rotate(-1.2deg);opacity:.2}to{transform:none;opacity:1}}

/* DiValis 2.34.13 — encrypted in-chat music cards. */
.messageMusicCard{width:min(315px,72vw);min-width:245px;padding:8px;border:1px solid rgba(124,67,88,.12);border-radius:17px;display:grid;grid-template-columns:54px minmax(0,1fr) 22px;align-items:center;gap:10px;text-align:left;background:linear-gradient(135deg,rgba(255,250,244,.96),rgba(255,235,232,.92));color:#603a49;box-shadow:inset 0 1px 0 rgba(255,255,255,.78),0 7px 18px rgba(90,45,62,.09);font:inherit;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,filter .16s ease}
.messageMusicCard:active{transform:scale(.975);filter:saturate(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.66),0 3px 10px rgba(90,45,62,.08)}
.messageTogetherCard{border-color:rgba(189,72,114,.23);background:linear-gradient(135deg,#fff8f2,#f9d9e4);box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 9px 24px rgba(140,52,86,.14)}
.messageTogetherCard .messageMusicCopy small{color:#ae456d;letter-spacing:.07em;text-transform:uppercase;font-weight:800}
.messageMusicArtwork{position:relative;width:54px;height:54px;border-radius:14px;overflow:hidden;display:grid;place-items:center;background:linear-gradient(145deg,#d95882,#783550);color:#fff;box-shadow:0 7px 15px rgba(100,45,66,.2)}
.messageMusicArtwork>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.messageMusicArtworkFallback .uiIcon{width:24px;height:24px}
.messageMusicPlay{position:absolute;right:4px;bottom:4px;width:20px;height:20px;border:1px solid rgba(255,255,255,.72);border-radius:50%;display:grid;place-items:center;background:rgba(91,37,58,.78);color:#fff;backdrop-filter:blur(6px)}
.messageMusicPlay .uiIcon{width:9px;height:9px;margin-left:1px}
.messageMusicCopy{min-width:0;display:grid;gap:2px}
.messageMusicCopy small{color:#bd4b73;font-size:9px;font-weight:850;letter-spacing:.11em;text-transform:uppercase}
.messageMusicCopy strong,.messageMusicCopy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.messageMusicCopy strong{font-size:13.5px;line-height:1.2;color:#5e3444}
.messageMusicCopy span{font-size:11px;color:#926a79}
.messageMusicOpen{display:grid;place-items:center;color:#ba5578;opacity:.8}.messageMusicOpen .uiIcon{width:17px;height:17px}
.bubble.outgoing .messageMusicCard{border-color:rgba(255,255,255,.28);background:linear-gradient(135deg,rgba(255,250,246,.98),rgba(255,225,226,.96));color:#5b3443}
@media(max-width:390px){.messageMusicCard{width:min(285px,76vw);min-width:228px;grid-template-columns:50px minmax(0,1fr) 18px}.messageMusicArtwork{width:50px;height:50px}}

/* DiValis 2.34.47 — saturated cover-centred frequency Ambilight. */
.musicNowPlaying{
  --viz-hue-primary:336;
  --viz-hue-secondary:28;
  --viz-hue-accent:288;
  --viz-sat-primary:62%;
  --viz-sat-secondary:58%;
  --viz-sat-accent:60%;
  --viz-bg-scale:1;
  --viz-bg-opacity:.62;
  --viz-bass-a-x:0px;
  --viz-bass-a-y:0px;
  --viz-bass-b-x:0px;
  --viz-bass-b-y:0px;
  --viz-bass-c-x:0px;
  --viz-bass-c-y:0px;
  --viz-mid-x:0px;
  --viz-mid-y:0px;
  --viz-mid-rotate:0deg;
  --viz-mid-opacity:.12;
  --viz-edge-x:0px;
  --viz-edge-y:0px;
  --viz-edge-scale:1;
  --viz-edge-opacity:.025;
  --viz-origin-x:50%;
  --viz-origin-y:40%;
  --viz-origin-size:300px;
  --viz-wave-bass-scale:.72;
  --viz-wave-bass-opacity:0;
  --viz-wave-mid-scale:.72;
  --viz-wave-mid-opacity:0;
  --viz-wave-high-scale:.72;
  --viz-wave-high-opacity:0;
  isolation:isolate;
  touch-action:none;
}
.musicNowBackdrop{
  z-index:0;
  inset:0;
  overflow:hidden;
  opacity:1;
  transform:none;
  background:
    radial-gradient(ellipse 90% 78% at 12% 8%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 18%),54%,.82) 0%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 10%),68%,.48) 44%,transparent 74%),
    radial-gradient(ellipse 86% 82% at 94% 12%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 18%),57%,.76) 0%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 10%),71%,.42) 49%,transparent 76%),
    radial-gradient(ellipse 100% 82% at 48% 108%,hsla(var(--viz-hue-accent),calc(var(--viz-sat-accent) + 18%),58%,.78) 0%,hsla(var(--viz-hue-accent),calc(var(--viz-sat-accent) + 10%),71%,.41) 53%,transparent 78%),
    linear-gradient(180deg,hsla(var(--viz-hue-primary),58%,89%,.98) 0%,hsla(var(--viz-hue-secondary),54%,88%,.97) 52%,hsla(var(--viz-hue-accent),58%,87%,.98) 100%);
  filter:none;
  pointer-events:none;
  contain:strict;
}
.musicNowBackdrop::before,.musicNowBackdrop::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}
.musicNowBackdrop::before{
  z-index:1;
  background:
    linear-gradient(105deg,transparent 3%,hsla(var(--viz-hue-primary),var(--viz-sat-primary),61%,.19) 36%,transparent 72%),
    linear-gradient(285deg,transparent 6%,hsla(var(--viz-hue-secondary),var(--viz-sat-secondary),63%,.17) 47%,transparent 84%);
  opacity:.72;
  transform:none;
}
.musicNowBackdrop::after{
  z-index:5;
  background:linear-gradient(180deg,rgba(255,250,240,.16),rgba(255,247,244,.03) 50%,rgba(255,240,246,.14));
}
.musicBackdropVisualizer{
  position:absolute;
  z-index:4;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  pointer-events:none;
  transform:translateZ(0);
}
.musicBackdropBassMass,.musicBackdropMidFlow,.musicBackdropHighEdge,.musicBackdropPulse{
  position:absolute;
  display:block;
  pointer-events:none;
  transform:translate3d(0,0,0);
  transform-origin:center;
  will-change:transform,opacity;
}
/* The old full-size layers stay as a rollback-safe structural fallback. The
   low-resolution canvas above now paints the same field in one texture. */
.musicBackdropBassMass,.musicBackdropMidFlow,.musicBackdropHighEdge,.musicBackdropPulse{display:none}
.musicBackdropBassMass{
  z-index:1;
  inset:-18%;
  opacity:var(--viz-bg-opacity);
  transition:transform 48ms linear,opacity 48ms linear;
}
.musicBackdropPulse{
  z-index:4;
  left:var(--viz-origin-x);
  top:var(--viz-origin-y);
  width:var(--viz-origin-size);
  height:var(--viz-origin-size);
  border-radius:50%;
  contain:layout paint style;
  transition:transform 40ms linear,opacity 40ms linear;
}
.musicBackdropPulseBass{
  opacity:var(--viz-wave-bass-opacity);
  transform:translate3d(-50%,-50%,0) scale(var(--viz-wave-bass-scale));
  background:radial-gradient(circle,transparent 47%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 22%),55%,.18) 54%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 22%),58%,.82) 62%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 14%),67%,.28) 72%,transparent 80%);
}
.musicBackdropPulseMid{
  opacity:var(--viz-wave-mid-opacity);
  transform:translate3d(-50%,-50%,0) scale(var(--viz-wave-mid-scale));
  background:radial-gradient(circle,transparent 57%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 24%),57%,.14) 61%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 24%),60%,.88) 66%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 16%),69%,.24) 72%,transparent 77%);
}
.musicBackdropPulseHigh{
  opacity:var(--viz-wave-high-opacity);
  transform:translate3d(-50%,-50%,0) scale(var(--viz-wave-high-scale));
  background:radial-gradient(circle,transparent 67%,hsla(var(--viz-hue-accent),calc(var(--viz-sat-accent) + 26%),55%,.08) 69%,hsla(var(--viz-hue-accent),calc(var(--viz-sat-accent) + 26%),62%,.96) 72%,transparent 76%);
}
.musicBackdropBassPrimary{
  transform:translate3d(var(--viz-bass-a-x),var(--viz-bass-a-y),0) scale(var(--viz-bg-scale));
  background:radial-gradient(ellipse 55% 61% at 20% 24%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 13%),54%,.88),hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 5%),67%,.38) 47%,transparent 72%);
}
.musicBackdropBassSecondary{
  transform:translate3d(var(--viz-bass-b-x),var(--viz-bass-b-y),0) scale(var(--viz-bg-scale));
  background:radial-gradient(ellipse 52% 59% at 83% 25%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 13%),57%,.82),hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 5%),69%,.34) 48%,transparent 73%);
}
.musicBackdropBassAccent{
  transform:translate3d(var(--viz-bass-c-x),var(--viz-bass-c-y),0) scale(var(--viz-bg-scale));
  background:radial-gradient(ellipse 63% 54% at 52% 84%,hsla(var(--viz-hue-accent),calc(var(--viz-sat-accent) + 13%),57%,.8),hsla(var(--viz-hue-accent),calc(var(--viz-sat-accent) + 5%),69%,.32) 50%,transparent 74%);
}
.musicBackdropMidFlow{
  z-index:2;
  inset:-14%;
  opacity:var(--viz-mid-opacity);
  transform:translate3d(var(--viz-mid-x),var(--viz-mid-y),0) rotate(var(--viz-mid-rotate));
  background:
    radial-gradient(ellipse 60% 28% at 28% 42%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 14%),56%,.9),transparent 67%),
    radial-gradient(ellipse 55% 30% at 74% 57%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 14%),59%,.84),transparent 68%),
    radial-gradient(ellipse 42% 29% at 50% 83%,hsla(var(--viz-hue-accent),calc(var(--viz-sat-accent) + 14%),60%,.74),transparent 69%);
  transition:transform 48ms linear,opacity 48ms linear;
}
.musicBackdropHighEdge{
  z-index:3;
  inset:-5%;
  opacity:var(--viz-edge-opacity);
  transform:translate3d(var(--viz-edge-x),var(--viz-edge-y),0) scale(var(--viz-edge-scale));
  background:
    radial-gradient(ellipse 10% 35% at 1% 30%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 18%),51%,1),transparent 64%),
    radial-gradient(ellipse 9% 32% at 100% 68%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 18%),54%,.98),transparent 64%),
    radial-gradient(ellipse 31% 9% at 27% 0%,hsla(var(--viz-hue-accent),calc(var(--viz-sat-accent) + 18%),55%,.94),transparent 64%),
    radial-gradient(ellipse 30% 9% at 73% 100%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 18%),54%,.92),transparent 64%);
  transition:transform 40ms linear,opacity 40ms linear;
}
.musicNowArtworkStage{
  --viz-level:0;
  --viz-bass:0;
  --viz-mid:0;
  --viz-high:0;
  --viz-beat:0;
  --viz-aura-opacity:.42;
  --viz-aura-scale:1.1;
  --viz-halo-opacity:.14;
  --viz-art-scale:1;
  --viz-hue-primary:336;
  --viz-hue-secondary:28;
  --viz-hue-accent:288;
  --viz-sat-primary:62%;
  --viz-sat-secondary:58%;
  --viz-sat-accent:60%;
  position:relative;
  isolation:isolate;
  align-self:center;
  justify-self:center;
  width:min(48vh,76vw,390px);
  aspect-ratio:1;
  display:grid;
  place-items:center;
  overflow:visible;
  contain:layout style;
}
.musicNowArtworkStage::after{
  content:"♥";
  position:absolute;
  z-index:9;
  left:50%;
  top:50%;
  color:#fff;
  font:900 clamp(62px,22vw,118px)/1 system-ui,sans-serif;
  opacity:0;
  transform:translate(-50%,-50%) scale(.45);
  filter:drop-shadow(0 8px 24px hsla(var(--viz-hue-primary),var(--viz-sat-primary),48%,.42));
  pointer-events:none;
}
.musicNowArtworkStage.musicDoubleLiked::after{animation:musicDoubleLikePop .7s cubic-bezier(.16,.82,.2,1)}
.musicNowArtworkStage .musicNowArtwork{
  position:relative;
  z-index:5;
  width:100%!important;
  height:100%;
  aspect-ratio:1;
  align-self:auto;
  justify-self:auto;
  transform:translateZ(0) scale(var(--viz-art-scale));
  transition:transform 82ms linear,box-shadow 120ms ease;
  box-shadow:
    0 30px 76px hsla(var(--viz-hue-primary),var(--viz-sat-primary),56%,.18),
    0 12px 42px hsla(var(--viz-hue-secondary),var(--viz-sat-secondary),66%,.18),
    inset 0 0 0 1px rgba(255,255,255,.72),
    0 0 0 1px hsla(var(--viz-hue-primary),var(--viz-sat-primary),62%,.12);
  will-change:transform;
}
.musicNowArtworkStage.musicVisualizerLive .musicNowArtwork{
  box-shadow:
    0 34px 86px hsla(var(--viz-hue-primary),var(--viz-sat-primary),59%,.24),
    0 14px 52px hsla(var(--viz-hue-secondary),var(--viz-sat-secondary),69%,.23),
    inset 0 0 0 1px rgba(255,255,255,.78),
    0 0 0 1px hsla(var(--viz-hue-primary),var(--viz-sat-primary),67%,.15);
}
.musicNowAura{
  position:absolute;
  z-index:0;
  inset:-30%;
  overflow:hidden;
  border-radius:38%;
  opacity:var(--viz-aura-opacity);
  transform:translate3d(0,0,0) scale(var(--viz-aura-scale));
  filter:blur(28px) saturate(1.92) brightness(1.14);
  mix-blend-mode:normal;
  pointer-events:none;
  transition:opacity 90ms linear,transform 90ms linear;
  will-change:opacity,transform;
  -webkit-mask-image:radial-gradient(ellipse at center,#000 0 35%,rgba(0,0,0,.92) 58%,rgba(0,0,0,.44) 75%,transparent 94%);
  mask-image:radial-gradient(ellipse at center,#000 0 35%,rgba(0,0,0,.92) 58%,rgba(0,0,0,.44) 75%,transparent 94%);
}
.musicNowAura::before,
.musicNowAura::after{
  content:"";
  position:absolute;
  inset:8%;
  border-radius:36%;
  pointer-events:none;
  background:
    radial-gradient(circle at 18% 22%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 10%),67%,.94),transparent 43%),
    radial-gradient(circle at 82% 24%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 10%),71%,.88),transparent 45%),
    radial-gradient(circle at 54% 84%,hsla(var(--viz-hue-accent),calc(var(--viz-sat-accent) + 10%),69%,.9),transparent 49%);
  will-change:transform;
}
.musicNowAura::before{
  opacity:.94;
  transform:rotate(0deg) scale(1.04);
}
.musicNowAura::after{
  inset:16%;
  opacity:.68;
  transform:rotate(38deg) scale(1.16);
}
.musicNowArtworkStage.musicVisualizerLive .musicNowAura::before{animation:musicAuraOrbit 10s linear infinite}
.musicNowArtworkStage.musicVisualizerLive .musicNowAura::after{animation:musicAuraOrbitReverse 13s linear infinite}
.musicNowVisualizer{
  display:none;
}
.musicNowHalo{
  position:absolute;
  z-index:1;
  pointer-events:none;
  border-radius:16%;
  opacity:var(--viz-halo-opacity);
  transition:opacity 90ms linear,transform 90ms linear;
  will-change:opacity,transform;
}
.musicNowHaloOuter{
  inset:-6%;
  border:1px solid hsla(var(--viz-hue-secondary),var(--viz-sat-secondary),74%,.48);
  box-shadow:
    0 0 38px hsla(var(--viz-hue-primary),var(--viz-sat-primary),68%,.24),
    inset 0 0 38px hsla(var(--viz-hue-accent),var(--viz-sat-accent),70%,.15);
  transform:rotate(-3deg) scale(var(--viz-aura-scale));
}
.musicNowHaloInner{
  inset:-5.5%;
  border:1px solid rgba(255,255,255,.54);
  box-shadow:0 0 18px hsla(var(--viz-hue-primary),var(--viz-sat-primary),66%,.2);
  transform:rotate(2deg);
  opacity:.22;
}
.musicNowArtworkStage.musicVisualizerBeat .musicNowHaloOuter{animation:musicHaloBeat .34s cubic-bezier(.12,.72,.18,1)}
.musicNowArtworkStage.musicVisualizerBeat .musicNowHaloInner{animation:musicHaloBeatInner .28s cubic-bezier(.12,.72,.18,1)}
@keyframes musicAuraOrbit{from{transform:rotate(0deg) scale(1.04)}50%{transform:rotate(180deg) scale(1.1)}to{transform:rotate(360deg) scale(1.04)}}
@keyframes musicAuraOrbitReverse{from{transform:rotate(38deg) scale(1.16)}50%{transform:rotate(-142deg) scale(1.08)}to{transform:rotate(-322deg) scale(1.16)}}
@keyframes musicDoubleLikePop{0%{opacity:0;transform:translate(-50%,-50%) scale(.45)}28%{opacity:.96;transform:translate(-50%,-50%) scale(1.12)}62%{opacity:.9;transform:translate(-50%,-50%) scale(.96)}100%{opacity:0;transform:translate(-50%,-58%) scale(1.22)}}
@keyframes musicHaloBeat{0%{filter:brightness(1);transform:rotate(-3deg) scale(1)}36%{filter:brightness(1.42);transform:rotate(-3deg) scale(1.035)}100%{filter:brightness(1);transform:rotate(-3deg) scale(1)}}
@keyframes musicHaloBeatInner{0%{opacity:.2;transform:rotate(2deg) scale(1)}38%{opacity:.72;transform:rotate(2deg) scale(1.025)}100%{opacity:.22;transform:rotate(2deg) scale(1)}}
@media(max-width:650px){
  .musicNowArtworkStage{width:min(42vh,78vw,340px)}
  .musicNowAura{inset:-28%;filter:blur(24px) saturate(1.72) brightness(1.11)}
}
@media(max-height:620px) and (orientation:portrait){
  .musicNowArtworkStage{width:min(30vh,58vw,210px)}
}
@media(max-height:650px) and (orientation:landscape){
  .musicNowArtworkStage{grid-row:1/-1;width:min(68vh,310px)}
  .musicNowArtworkStage .musicNowArtwork{grid-row:auto}
}
@media(prefers-reduced-motion:reduce){
  .musicNowAura::before,.musicNowAura::after,.musicNowHalo,.musicBackdropPulse{animation:none!important}
  .musicNowArtworkStage .musicNowArtwork{transform:none!important;transition:none}
}

/* DiValis music transport modes: compact, clear and touch friendly. */
.musicNowControls{width:min(100%,380px);margin-inline:auto;justify-content:space-between;gap:clamp(6px,2.4vw,18px)}
.musicModeControl{position:relative;transition:color .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .12s ease}
.musicNowControl.musicModeControl{width:44px;height:44px;background:rgba(255,255,255,.38);color:rgba(100,55,72,.64)}
.musicModeControl.active{border-color:rgba(181,65,105,.22)!important;background:rgba(190,68,109,.16)!important;color:#a93460!important;box-shadow:0 7px 18px rgba(134,46,78,.12)}
.musicPlayer .musicModeControl.active{border-color:rgba(255,255,255,.54)!important;background:rgba(255,255,255,.94)!important;color:#a13d63!important;box-shadow:0 5px 14px rgba(57,17,33,.22)!important}
.musicModeControl[data-repeat-mode="one"]::after{content:"1";position:absolute;left:50%;top:50%;width:12px;height:12px;margin:-6px 0 0 -6px;display:grid;place-items:center;border-radius:50%;background:#a93460;color:#fff;font:800 7px/1 system-ui,sans-serif;box-shadow:0 0 0 2px rgba(255,255,255,.72)}
@media(max-width:650px){
  .musicNowControls{gap:6px}
  .musicNowControl.musicModeControl{width:38px;height:38px}
  .musicPlayerControls{gap:3px!important}
  .musicPlayerControls .musicModeControl{width:30px!important;height:30px!important}
  .musicPlayerControls #musicPrevious{display:grid}
}

/* In the expanded player the real Ambilight surface owns the complete iPhone
   viewport. The library shell must not paint a separate safe-area strip. */
.musicHub.player-expanded{background:transparent!important}
.musicHub.player-expanded .musicHubShell{
  width:100%;
  max-width:none;
  height:100dvh;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
.musicHub.player-expanded .musicNowPlaying{
  position:absolute!important;
  inset:0!important;
  width:100%;
  height:100%;
  min-height:100%;
  border-radius:0;
}

/* The chat workspace is pinned to visualViewport so its composer follows the
   iOS keyboard. The expanded player must instead own the physical viewport:
   its real backdrop canvas continues below the translucent status bar. */
@media (max-width:720px){
  html.music-player-expanded{
    width:100%!important;
    height:100%!important;
    height:100dvh!important;
    overflow:hidden!important;
  }
  body.music-player-expanded{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:none!important;
    overflow:hidden!important;
  }
  body.music-player-expanded::before{
    display:none!important;
  }
  body.music-player-expanded .musicHub.player-expanded{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    overflow:hidden!important;
    z-index:7000!important;
  }
  body.music-player-expanded .musicHub.player-expanded .musicHubShell{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
  }
}

/* Some standalone/browser viewport combinations expose the document behind
   the safe area even when a fixed child is extended upward. Paint that
   fallback with the same cover palette as the player, never the chat sand. */
html.music-player-expanded,
body.music-player-expanded{
  background:
    radial-gradient(ellipse 90% 78% at 12% 8%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 18%),54%,.82) 0%,hsla(var(--viz-hue-primary),calc(var(--viz-sat-primary) + 10%),68%,.48) 44%,transparent 74%),
    radial-gradient(ellipse 86% 82% at 94% 12%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 18%),57%,.76) 0%,hsla(var(--viz-hue-secondary),calc(var(--viz-sat-secondary) + 10%),71%,.42) 49%,transparent 76%),
    linear-gradient(180deg,hsla(var(--viz-hue-primary),58%,89%,.98) 0%,hsla(var(--viz-hue-secondary),54%,88%,.97) 52%,hsla(var(--viz-hue-accent),58%,87%,.98) 100%)!important;
}

/* DiValis 2.35 — a calm, low-cost shared listening surface. */
.musicTogetherToggle{position:relative;overflow:visible;transition:transform .18s ease,color .2s ease,background .2s ease,box-shadow .2s ease}
.musicTogetherToggle>i{position:absolute;right:1px;bottom:2px;width:9px;height:9px;border:2px solid rgba(255,255,255,.92);border-radius:50%;background:#b7a2aa;box-shadow:0 2px 7px rgba(84,37,55,.2);transition:background .2s ease,transform .2s ease}
.musicTogetherToggle.active{border-color:rgba(255,255,255,.64);background:linear-gradient(145deg,rgba(218,91,137,.96),rgba(155,53,94,.96));color:#fff;box-shadow:0 10px 25px rgba(139,40,77,.28)}
.musicTogetherToggle.active>i{background:#66c68a;transform:scale(1.08)}
.musicTogetherToggle.waiting>i{background:#f0b65d;animation:musicTogetherWaiting 1.6s ease-in-out infinite}
.musicTogetherToggle.invited>i{background:#70cb91;animation:musicTogetherWaiting 1.15s ease-in-out infinite}
.musicTogetherToggle:active{transform:scale(.92)}
.musicPlayer.musicTogetherActive::after,.musicMiniPlayer.musicTogetherActive::after{content:"";position:absolute;z-index:5;left:8px;top:8px;width:8px;height:8px;border:2px solid rgba(255,255,255,.94);border-radius:50%;background:#69ca8d;box-shadow:0 0 0 4px rgba(105,202,141,.16)}
.musicTogetherReactionLayer{position:absolute;z-index:12;inset:0;overflow:hidden;pointer-events:none}
.musicTogetherReactionLayer>span{position:absolute;left:var(--reaction-x);bottom:15%;font-size:clamp(32px,9vw,54px);line-height:1;filter:drop-shadow(0 10px 18px rgba(99,34,59,.2));animation:musicTogetherReaction 1.85s cubic-bezier(.17,.75,.23,1) forwards;will-change:transform,opacity}
.musicTogetherActivity{position:absolute;z-index:14;top:calc(65px + env(safe-area-inset-top));right:14px;width:min(300px,calc(100% - 28px));display:grid;gap:7px;pointer-events:none}.musicTogetherActivity:empty{display:none}.musicTogetherActivityItem{min-width:0;display:grid;grid-template-columns:32px minmax(0,1fr);gap:9px;align-items:center;padding:8px 12px 8px 8px;border:1px solid rgba(255,255,255,.63);border-radius:18px;background:rgba(255,247,239,.91);color:#684253;box-shadow:0 10px 30px rgba(94,41,57,.16);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:musicTogetherActivityIn .23s ease-out both}.musicTogetherActivityItem>i{width:32px;height:32px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(145deg,#e47799,#ad4770);color:#fff;font-size:17px;font-style:normal}.musicTogetherActivityItem>span{min-width:0;display:grid;gap:2px}.musicTogetherActivityItem strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.musicTogetherActivityItem small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#976b7b;font-size:10px}.musicTogetherActivityItem.message small{white-space:normal;overflow-wrap:anywhere;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.musicTogetherActivityItem.leaving{opacity:0;transform:translateX(14px);transition:opacity .2s ease,transform .2s ease}@keyframes musicTogetherActivityIn{from{opacity:0;transform:translate3d(14px,-4px,0)}to{opacity:1;transform:translate3d(0,0,0)}}
.musicTogetherAlbumVote{position:absolute;z-index:15;top:calc(65px + env(safe-area-inset-top));left:14px;width:min(290px,calc(100% - 28px));padding:10px;border:1px solid rgba(255,255,255,.78);border-radius:19px;background:rgba(255,248,240,.95);color:#683e50;box-shadow:0 16px 42px rgba(92,37,59,.21);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.musicTogetherAlbumVote.hidden{display:none!important}.musicTogetherVoteHead{display:grid;grid-template-columns:42px minmax(0,1fr);gap:9px;align-items:center}.musicTogetherVoteHead>img,.musicTogetherVoteHead>.uiIcon{width:42px;height:42px;border-radius:12px;object-fit:cover}.musicTogetherVoteHead>span{min-width:0;display:grid;gap:2px}.musicTogetherVoteHead small{font-size:9px;color:#ac6481;text-transform:uppercase;letter-spacing:.08em}.musicTogetherVoteHead strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 15px/1.1 Georgia,"Times New Roman",serif}.musicTogetherVoteHead i{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;font-style:normal;color:#936778}.musicTogetherVoteFoot{display:flex;gap:6px;align-items:center;margin-top:9px}.musicTogetherVoteFoot>small{flex:1;font-size:10px;color:#956e7d}.musicTogetherVoteFoot button{min-height:32px;padding:0 10px;border:0;border-radius:11px;background:#f2d9e2;color:#7b425b;font:700 11px/1 inherit}.musicTogetherVoteFoot button:last-child{background:#b84971;color:#fff}.musicTogetherVoteFoot b{font-size:10px;color:#985c73}
.musicAlbumModal{width:min(92vw,470px)}.musicAlbumModal .modal-body{max-height:min(58dvh,480px);overflow:auto}.musicAlbumLoading,.musicAlbumError{padding:28px 10px;text-align:center;color:#906c7c;font-size:13px}.musicAlbumHero{display:grid;grid-template-columns:76px minmax(0,1fr);gap:13px;align-items:center;padding:2px 0 14px}.musicAlbumHero>img,.musicAlbumHero>.uiIcon{width:76px;height:76px;object-fit:cover;border-radius:20px;box-shadow:0 9px 23px rgba(86,40,57,.14)}.musicAlbumHero>span{display:grid;gap:5px;min-width:0}.musicAlbumHero small{color:#a96a80;font-size:10px}.musicAlbumHero strong{color:#66374b;font:700 21px/1.1 Georgia,"Times New Roman",serif}.musicAlbumHero i{color:#9b7382;font-size:11px;font-style:normal}.musicAlbumTracks{display:grid;gap:2px;margin:0;padding:0;list-style:none}.musicAlbumTracks li{display:grid;grid-template-columns:30px minmax(0,1fr) 18px;gap:7px;align-items:center;min-height:37px;padding:4px 8px;border-radius:10px;background:rgba(255,255,255,.37);font-size:11px}.musicAlbumTracks li:nth-child(even){background:rgba(245,221,228,.48)}.musicAlbumTracks li>span{color:#af7c8d}.musicAlbumTracks li>strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicAlbumTracks li>i{color:#bd4c75;font-style:normal}.musicAlbumTracks li.missing{opacity:.56}.musicAlbumHint{margin:11px 4px 2px;color:#956d7d;font-size:10px;line-height:1.4}
.musicTogetherVoteFoot button{font-size:11px;font-weight:700}
@media(max-width:650px){#musicNowPlaying:has(.musicTogetherAlbumVote:not(.hidden)) .musicTogetherActivity{top:calc(190px + env(safe-area-inset-top))}.musicTogetherAlbumVote{width:min(320px,calc(100% - 28px))}}
.musicTogetherMessageForm{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:7px;margin-top:10px}.musicTogetherMessageForm input{min-width:0;height:44px;padding:0 13px;border:1px solid rgba(128,66,87,.16);border-radius:15px;background:rgba(255,255,255,.72);color:#643b4c;font:inherit;font-size:12px;outline:none}.musicTogetherMessageForm input:focus{border-color:#c36183}.musicTogetherMessageForm button{min-width:72px;border:0;border-radius:15px;background:#b84670;color:#fff;font-weight:750}.musicTogetherContact.selected{background:rgba(216,109,146,.19);box-shadow:inset 0 0 0 2px rgba(183,70,109,.55)}.musicTogetherContact.selected>.uiIcon{color:#ad416b}.musicTogetherSelectionHint{margin:2px 4px 9px;color:#977081;font-size:11px}
.musicTogetherMessageNotice{display:block;margin:7px 3px 0;color:#987482;font-size:10px;line-height:1.35}
.musicTogetherInviteDock{position:fixed;z-index:4300;left:50%;bottom:max(82px,calc(68px + env(safe-area-inset-bottom)));width:min(430px,calc(100vw - 24px));min-height:68px;padding:8px 12px 8px 8px;border:1px solid rgba(255,255,255,.8);border-radius:23px;display:grid;grid-template-columns:52px minmax(0,1fr) 22px;gap:11px;align-items:center;background:linear-gradient(135deg,rgba(255,248,239,.98),rgba(247,218,228,.98));color:#6c3c4f;text-align:left;box-shadow:0 22px 60px rgba(91,35,56,.27);transform:translateX(-50%);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.musicTogetherInviteDock.hidden{display:none!important}.musicTogetherDockIcon{position:relative;width:52px;height:52px;border-radius:18px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#e27599,#91395c);box-shadow:0 10px 25px rgba(134,42,76,.22)}.musicTogetherDockIcon>.uiIcon{width:25px;height:25px}.musicTogetherDockIcon>i{position:absolute;right:3px;bottom:3px;width:9px;height:9px;border:2px solid #fff;border-radius:50%;background:#6aca8f}.musicTogetherInviteDock>span:nth-child(2){min-width:0;display:grid;gap:4px}.musicTogetherInviteDock strong,.musicTogetherInviteDock small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicTogetherInviteDock strong{font:700 17px/1 Georgia,"Times New Roman",serif}.musicTogetherInviteDock small{color:#a47687;font-size:10px}.musicTogetherDockArrow{width:18px;height:18px;color:#ad5b79}.musicTogetherInviteDock:active{transform:translateX(-50%) scale(.98)}
.musicTogetherModal{width:min(92vw,440px);border-color:rgba(255,255,255,.74);background:linear-gradient(155deg,rgba(255,250,243,.985),rgba(249,229,231,.98));box-shadow:0 32px 90px rgba(86,35,54,.28)}
.musicTogetherModal .modal-header{border-bottom-color:rgba(129,68,89,.09)}
.musicTogetherInviteHero{display:grid;grid-template-columns:58px minmax(0,1fr);gap:13px;align-items:center;margin-bottom:13px;padding:4px 2px}
.musicTogetherInviteAvatar{width:58px;height:58px;display:grid;place-items:center;border-radius:20px;background:linear-gradient(145deg,#e77c9e,#93405f);color:#fff;box-shadow:0 12px 28px rgba(143,47,82,.22)}
.musicTogetherInviteAvatar>.uiIcon{width:27px;height:27px}.musicTogetherInviteAvatar .avatar{width:58px;height:58px;border-radius:20px}
.musicTogetherInviteHero>span:last-child{min-width:0;display:grid;gap:5px}.musicTogetherInviteHero strong{color:#69394c;font:700 18px/1.16 Georgia,"Times New Roman",serif}.musicTogetherInviteHero small{color:#a17484;font-size:11px;line-height:1.4}
.musicTogetherStartHero,.musicTogetherSessionHero{display:flex;flex-direction:column;align-items:center;text-align:center;padding:5px 7px 13px}
.musicTogetherStartHero>.avatar,.musicTogetherStartHero>span>.avatar{width:84px;height:84px;border-radius:28px;box-shadow:0 17px 36px rgba(111,43,68,.18)}
.musicTogetherStartHero strong,.musicTogetherSessionHero strong{margin-top:14px;color:#633548;font:700 22px/1.15 Georgia,"Times New Roman",serif}
.musicTogetherStartHero p,.musicTogetherSessionHero p{max-width:330px;margin:8px 0 0;color:#987080;font-size:12px;line-height:1.55}
.musicTogetherLiveMark{position:relative;width:74px;height:74px;border-radius:27px;display:grid;place-items:center;color:#fff;background:linear-gradient(145deg,#e16d95,#8f375b);box-shadow:0 18px 40px rgba(137,43,78,.25)}
.musicTogetherLiveMark>.uiIcon{width:34px;height:34px}.musicTogetherLiveMark>i{position:absolute;right:8px;bottom:8px;width:12px;height:12px;border:3px solid #fff;border-radius:50%;background:#67c98c;box-shadow:0 0 0 6px rgba(103,201,140,.18)}
.musicTogetherReactions{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:5px;padding:10px;border:1px solid rgba(126,68,88,.09);border-radius:21px;background:rgba(255,255,255,.42)}
.musicTogetherReactions button{min-height:52px;border:0;border-radius:16px;background:rgba(255,255,255,.72);font-size:25px;box-shadow:0 7px 18px rgba(87,37,55,.07);transition:transform .14s ease,background .14s ease}
.musicTogetherReactions button:active{transform:scale(.87);background:#fff}
.musicTogetherPicker{display:grid;gap:6px;max-height:min(58vh,430px);overflow:auto}
.musicTogetherContact{width:100%;min-height:66px;padding:7px;border:0;border-radius:18px;display:grid;grid-template-columns:52px minmax(0,1fr) 24px;gap:11px;align-items:center;background:rgba(255,255,255,.48);color:#6b3d4e;text-align:left}
.musicTogetherContact .avatar{width:52px;height:52px;border-radius:18px}.musicTogetherContact>span{min-width:0;display:grid;gap:3px}.musicTogetherContact strong,.musicTogetherContact small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.musicTogetherContact small{color:#a37a89;font-size:10px}.musicTogetherContact>.uiIcon{width:18px;height:18px;color:#b66783}
.musicTogetherContact:active{background:#f3dfe5;transform:scale(.985)}
.musicTogetherModal .btn.danger{color:#a33c60;border-color:rgba(169,55,94,.2);background:rgba(255,255,255,.5)}
@keyframes musicTogetherWaiting{0%,100%{opacity:.62;box-shadow:0 0 0 0 rgba(240,182,93,.3)}50%{opacity:1;box-shadow:0 0 0 6px rgba(240,182,93,0)}}
@keyframes musicTogetherReaction{0%{opacity:0;transform:translate3d(-50%,24px,0) scale(.5) rotate(0)}18%{opacity:1;transform:translate3d(-50%,0,0) scale(1.08) rotate(var(--reaction-rotate))}100%{opacity:0;transform:translate3d(calc(-50% + var(--reaction-drift)),-62vh,0) scale(.84) rotate(var(--reaction-rotate))}}
@media(max-width:650px){.musicTogetherModal{width:calc(100vw - 18px)}.musicTogetherReactions button{min-height:48px}.musicTogetherReactionLayer>span{bottom:12%}}
@media(prefers-reduced-motion:reduce){.musicTogetherToggle.waiting>i,.musicTogetherReactionLayer>span,.musicTogetherActivityItem{animation:none!important}.musicTogetherReactionLayer>span{display:none}}

/* Personal music playlists */
.musicNowActions{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:6px}
.musicNowActions button{min-width:0;padding-inline:4px;white-space:nowrap}
.musicNowActions #musicAddPlaylist .uiIcon{width:20px;height:20px}
.musicPlaylistsHomeCard{width:100%;min-height:106px;margin:0 0 16px;padding:14px 18px;border:1px solid rgba(151,75,102,.14);border-radius:25px;display:grid;grid-template-columns:62px minmax(0,1fr) auto;align-items:center;gap:14px;background:linear-gradient(125deg,rgba(255,250,240,.86),rgba(248,212,224,.8));color:#693f4d;text-align:left;box-shadow:0 13px 29px rgba(104,50,72,.08)}
.musicPlaylistsHomeIcon{width:62px;height:62px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(145deg,#d46b8b,#9f4166);color:#fff;box-shadow:0 9px 21px rgba(143,57,87,.2)}
.musicPlaylistsHomeIcon .uiIcon{width:29px;height:29px}
.musicPlaylistsHomeCard>span:nth-child(2){min-width:0;display:grid;gap:3px}.musicPlaylistsHomeCard small{color:#b27889;font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.musicPlaylistsHomeCard strong{font:700 22px/1.1 Georgia,"Times New Roman",serif}.musicPlaylistsHomeCard i{color:#a47a88;font-size:11px;font-style:normal}.musicPlaylistsHomeCard>.uiIcon{width:20px;height:20px;transform:rotate(180deg);color:#b05a78}
.musicPlaylistsHomeCovers{display:flex;align-items:center}.musicPlaylistsHomeCovers>span{width:35px;height:35px;margin-left:-10px}.musicPlaylistsHomeCovers .musicCollectionMosaic{width:35px;height:35px;border:2px solid #fff;border-radius:11px;box-shadow:0 4px 10px rgba(87,40,58,.13)}.musicPlaylistsHomeCovers .musicCollectionMosaic .uiIcon{width:17px;height:17px}
.musicPlaylistsPage{padding:3px 1px 30px}.musicPlaylistsHeading{min-height:106px;margin-bottom:15px;padding:19px;border:1px solid rgba(255,255,255,.7);border-radius:26px;display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(125deg,rgba(255,248,236,.9),rgba(246,216,226,.9));box-shadow:0 12px 31px rgba(107,52,74,.08)}.musicPlaylistsHeading>span{display:grid;gap:5px}.musicPlaylistsHeading small{color:#b7798d;font-size:9px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}.musicPlaylistsHeading strong{font:700 28px/1 Georgia,"Times New Roman",serif;color:#673c4c}.musicPlaylistsHeading button,.musicPlaylistsPage .musicEmpty button{min-height:41px;padding:0 14px;border:0;border-radius:15px;display:flex;align-items:center;gap:7px;background:#b94d73;color:#fff;font-weight:750;box-shadow:0 8px 17px rgba(153,54,90,.19)}.musicPlaylistsHeading button .uiIcon{width:17px;height:17px}
.musicPlaylistsGrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.musicPlaylistCard{min-width:0;min-height:92px;padding:11px;border:1px solid rgba(154,76,104,.11);border-radius:22px;display:grid;grid-template-columns:62px minmax(0,1fr) 18px;align-items:center;gap:11px;background:rgba(255,255,255,.64);color:#6e4051;text-align:left;box-shadow:0 8px 23px rgba(99,47,67,.06)}.musicPlaylistCard .musicCollectionMosaic,.musicPlaylistChoice .musicCollectionMosaic{width:62px;height:62px;border-radius:17px;background:linear-gradient(145deg,#d56f91,#914461);box-shadow:none;transform:none}.musicPlaylistCard .musicCollectionMosaic .uiIcon,.musicPlaylistChoice .musicCollectionMosaic .uiIcon{width:26px;height:26px}.musicPlaylistCard>span:nth-child(2),.musicPlaylistChoice>span:nth-child(2){min-width:0;display:grid;gap:5px}.musicPlaylistCard strong,.musicPlaylistChoice strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:14px}.musicPlaylistCard small,.musicPlaylistChoice small{color:#a77d8b;font-size:10px}.musicPlaylistCard>.uiIcon{width:17px;height:17px;transform:rotate(180deg);color:#bd6985}
.musicPlaylistToolbar{display:flex;flex-wrap:wrap;gap:7px;padding:12px 0}.musicPlaylistToolbar button{min-height:39px;padding:0 13px;border:1px solid rgba(152,77,101,.13);border-radius:14px;display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.63);color:#8a5368;font-size:11px;font-weight:760}.musicPlaylistToolbar button:first-child{border:0;background:linear-gradient(130deg,#d36c8e,#a4436a);color:#fff}.musicPlaylistToolbar button.danger{color:#a34863}.musicPlaylistToolbar button:disabled{opacity:.45}.musicPlaylistToolbar .uiIcon{width:15px;height:15px}
.musicPlaylistTracks{display:grid;gap:8px}.musicPlaylistTrack{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;align-items:center}.musicPlaylistTrack .musicTrack{min-width:0}.musicPlaylistTrackTools{display:flex;gap:3px}.musicPlaylistTrackTools button{width:30px;height:38px;padding:0;border:1px solid rgba(146,73,98,.12);border-radius:10px;background:rgba(255,255,255,.64);color:#9a5a72;font-size:16px}.musicPlaylistTrackTools button:disabled{opacity:.32}.musicPlaylistTrackTools .uiIcon{width:15px;height:15px}.musicPlaylistField{display:grid;gap:8px;color:#81556a;font-size:12px;font-weight:800}.musicPlaylistField input{width:100%;height:49px;padding:0 15px;border:1px solid rgba(150,75,100,.2);border-radius:15px;background:#fff;color:#583646;font:inherit;font-size:15px;outline:none}.musicPlaylistField input:focus{border-color:#b44d73;box-shadow:0 0 0 3px rgba(180,77,115,.12)}.musicPlaylistPrivacy{margin:11px 2px 0;color:#9c7484;font-size:11px;line-height:1.45}.musicPlaylistChoices{max-height:44vh;margin-top:11px;overflow:auto;display:grid;gap:7px}.musicPlaylistChoice{width:100%;min-height:72px;padding:5px 11px 5px 5px;border:1px solid rgba(149,77,101,.1);border-radius:19px;display:grid;grid-template-columns:62px minmax(0,1fr) 20px;gap:10px;align-items:center;background:rgba(255,255,255,.66);color:#704052;text-align:left}.musicPlaylistChoice>.uiIcon{width:18px;height:18px;color:#b65377}.musicPlaylistChoice:disabled{opacity:.5}.musicPlaylistEmptyShort{padding:18px;border:1px dashed rgba(166,85,111,.2);border-radius:17px;color:#977284;text-align:center;font-size:12px;line-height:1.45}
@media(max-width:650px){.musicPlaylistsGrid{grid-template-columns:1fr}.musicNowActions{gap:4px}.musicNowActions button{padding:4px 2px;border-radius:13px}.musicNowActions button strong{font-size:7px}.musicPlaylistTrack{grid-template-columns:minmax(0,1fr) 30px}.musicPlaylistTrackTools{display:flex;flex-direction:column}.musicPlaylistTrackTools button{width:30px;height:24px;font-size:13px}.musicPlaylistTrackTools .uiIcon{width:12px;height:12px}.musicPlaylistTrack .musicTrack{grid-template-columns:45px minmax(0,1fr) auto;gap:7px}.musicPlaylistTrack .musicTrackArt{width:45px;height:45px}.musicPlaylistTrack .musicTrackMeta strong{font-size:12px}.musicPlaylistTrack .musicTrackMeta small{font-size:9px}}