/* Mobile DM proportions and message grouping from the supplied reference. */
.instagram.dm-room{--dm-purple:#6b3cff;--dm-gray:#f0f1f5;background:#fff;color:#101519}
.instagram.dm-room .dm-header{min-height:74px;padding:10px 14px 12px;gap:11px;border:0;background:#fff;z-index:2}
.dm-header .dm-back,.dm-call-tools button{width:42px;height:42px;min-width:42px;padding:10px;border:1px solid #e7e7e9;border-radius:50%;background:linear-gradient(145deg,#fff,#f7f7f8);box-shadow:inset 0 1px 2px #fff,0 2px 5px #00000003;display:grid;place-items:center}
.dm-header .dm-back .ig-icon{width:26px;height:26px;stroke-width:2}
.instagram .dm-header .dm-person{display:flex;align-items:center;gap:9px;min-width:0;flex:1;padding:0;height:auto}
.dm-header .dm-person .avatar{height:31px;width:31px;border-radius:50%}
.dm-header .dm-person>span{min-width:0;text-align:left}
.dm-header .dm-person b{display:flex;align-items:center;gap:4px;font-size:15px;font-weight:700;white-space:nowrap;letter-spacing:-.4px}
.dm-header .dm-person b .ig-icon{width:13px;height:13px;stroke-width:1.8}
.instagram .dm-header .dm-person small{margin-top:3px;font-size:11px;color:#30363a;white-space:nowrap}
.dm-call-tools{display:flex;gap:10px;position:relative;isolation:isolate;flex-shrink:0}
.dm-call-tools .ig-icon{width:24px;height:24px;stroke-width:1.9}
.instagram.dm-room .dm-history{padding:0 8px 12px 15px;background:#fff}
.dm-room .dm-intro{padding:28px 14px 24px}
.instagram.dm-room .native-date{font-size:12px;color:#77808b;padding:8px 0;margin:14px auto 16px}
.instagram.dm-room .native-message{padding:0;margin:0 0 2px;gap:12px;align-items:flex-end}
.instagram.dm-room .native-message.first{margin-top:12px}
.instagram.dm-room .native-message .message-avatar,.instagram.dm-room .message-avatar img{width:27px;height:27px;min-width:27px;border-radius:50%;display:block}
.instagram.dm-room .message-avatar{margin-bottom:1px}
.instagram.dm-room .message-column{max-width:calc(100% - 52px);display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.instagram.dm-room .out .message-column{align-items:flex-end}
.instagram.dm-room .message-bubble{max-width:100%;background:var(--dm-gray);color:#101519;padding:9px 13px;font-size:14px;line-height:1.45;border-radius:21px!important;white-space:pre-wrap;overflow-wrap:anywhere;box-shadow:none}
.instagram.dm-room .out .message-bubble{background:var(--dm-purple);color:#fff}
.instagram.dm-room .in:not(.last) .message-bubble{border-bottom-left-radius:5px!important}
.instagram.dm-room .in.continued .message-bubble{border-top-left-radius:5px!important}
.instagram.dm-room .out:not(.last) .message-bubble{border-bottom-right-radius:5px!important}
.instagram.dm-room .out.continued .message-bubble{border-top-right-radius:5px!important}
.dm-photo-message{padding:0;border:0;border-radius:17px;overflow:hidden;background:var(--dm-gray);max-width:100%;line-height:0;display:block}
.dm-photo-message img{display:block;width:auto;height:auto;max-width:190px;max-height:290px;object-fit:contain}
.dm-photo-preview{display:block;width:100%;height:auto;max-height:65vh;object-fit:contain;border-radius:12px}
.instagram.dm-room .dm-seen{font-size:10px;color:#77808b;margin:6px 6px 0}
.instagram.dm-room .native-typing{margin-left:39px}
.instagram.dm-room .dm-composer{position:relative;display:block;min-height:76px;padding:5px 7px 27px;background:#fff;border:0}
.dm-input-bar{display:flex;align-items:center;gap:6px;min-height:44px;padding:4px 10px 4px 5px;border-radius:28px;background:#f5f5f5}
.dm-input-bar button{display:grid;place-items:center;flex-shrink:0;padding:0;color:#101519;width:29px;height:34px}
.dm-input-bar .dm-camera{width:34px;height:34px;border-radius:50%;background:#5c4dff;color:#fff}
.dm-camera .ig-icon{width:22px;height:22px;stroke-width:2.3}
.instagram .dm-composer input{flex:1;width:0;min-width:0;padding:7px 2px 7px 3px;font-size:14px;line-height:22px;color:#101519}
.instagram .dm-composer input::placeholder{color:#78818c;opacity:1}
.dm-input-tools{display:flex;align-items:center;gap:8px;flex-shrink:0}
.dm-input-tools .ig-icon{width:23px;height:23px;stroke-width:2}
.dm-input-tools .ig-icon-mic{width:22px;height:23px}
.instagram .dm-composer .send-button{display:none;width:34px;height:34px;border-radius:50%;background:var(--dm-purple);color:#fff}
.dm-composer.has-draft .dm-input-tools{display:none}
.instagram .dm-composer.has-draft .send-button{display:grid}
.dm-composer .send-button .ig-icon{width:21px;height:21px}
.dm-room .dm-jump{position:absolute;right:15px;bottom:89px;width:43px;height:43px;padding:10px;display:grid;place-items:center;background:#fff;border-radius:50%;box-shadow:0 3px 16px #0002;z-index:3}
.dm-room .dm-jump[hidden]{display:none}
.dm-jump .ig-icon{height:26px;width:26px;stroke-width:2.8}
.dm-sticker-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.dm-sticker-picker button{padding:14px;font-size:32px;background:#f5f5f5;border-radius:16px}
.dm-room button:focus-visible{outline:2px solid var(--dm-purple);outline-offset:3px}
.font-large .instagram.dm-room .message-bubble,.font-large .instagram .dm-composer input{font-size:17px}
@media(max-width:600px){
  .instagram.dm-room .dm-header{min-height:81px;padding-top:12px;padding-bottom:16px;gap:11px}
  .dm-header .dm-back,.dm-call-tools button{width:44px;height:44px;min-width:44px}
  .dm-header .dm-person b{font-size:16px}
  .instagram .dm-header .dm-person small{font-size:12px}
  .instagram.dm-room .dm-history{padding-left:16px}
  .instagram.dm-room .message-bubble{font-size:16px;padding:9px 13px}
  .instagram.dm-room .native-date{font-size:12px;margin-top:15px;margin-bottom:19px}
  .instagram.dm-room .dm-composer{padding-bottom:max(27px,env(safe-area-inset-bottom));padding-left:8px;padding-right:8px}
  .instagram .dm-composer input{font-size:16px}
  .dm-input-bar{min-height:44px}
  .dm-room .dm-jump{bottom:max(89px,calc(env(safe-area-inset-bottom) + 62px))}
}
@media(max-width:360px){
  .instagram.dm-room .dm-header{padding-left:10px;padding-right:10px;gap:8px}
  .dm-call-tools{gap:7px}
  .dm-header .dm-back,.dm-call-tools button{width:39px;height:39px;min-width:39px;padding:8px}
  .instagram .dm-header .dm-person{gap:7px}
  .dm-input-tools{gap:5px}
  .dm-input-tools button{width:26px}
}

.dm-typing-row{display:flex;align-items:flex-end;gap:10px;margin:10px 0 12px;min-height:34px}
.dm-typing-avatar .avatar{width:25px;height:25px;border-radius:50%;object-fit:cover}
.dm-typing-bubble{display:flex;align-items:center;gap:5px;padding:13px 16px;background:#efefef;border-radius:18px;min-height:36px}
.dm-typing-bubble i{display:block;width:6px;height:6px;border-radius:50%;background:#8e8e93;animation:dm-writing 1.2s ease-in-out infinite}
.dm-typing-bubble i:nth-child(2){animation-delay:.15s}.dm-typing-bubble i:nth-child(3){animation-delay:.3s}
.dm-typing-label{font-size:10px;color:#8e8e93;align-self:center}
@keyframes dm-writing{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}
.no-motion .dm-typing-bubble i{animation:none;opacity:.7}
@media(prefers-reduced-motion:reduce){.dm-typing-bubble i{animation:none;opacity:.7}}

.dm-room .casual-suggestions{background:var(--ig-bg,#fff);padding:3px 14px 6px}.dm-room .casual-suggestions .suggestion-list button{background:#f3f0ff;border:1px solid #ded6f5;color:#40345f}.dm-room .casual-suggestions .suggestion-toggle{color:#73628d}
