
.media-picker{position:absolute;left:8px;bottom:74px;width:min(390px,calc(100% - 16px));background:#101720;border:1px solid #334154;border-radius:12px;box-shadow:0 18px 48px rgba(0,0,0,.5);z-index:20;overflow:hidden}
.media-picker[hidden]{display:none!important}.chat-card{position:relative}
.media-picker-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #293442;padding:8px}
.media-tabs{display:flex;gap:6px}.media-tab,.media-close{border:1px solid #334154;background:#18212d;color:#aeb9c8;border-radius:7px;font-weight:800;padding:7px 10px;cursor:pointer}
.media-tab.active{color:#fff;border-color:#ff7136;background:#2a1b16}.media-close{font-size:18px;line-height:1;padding:6px 9px}
.media-pane{display:none;padding:10px}.media-pane.active{display:block}
.emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:4px;max-height:230px;overflow:auto}
.emoji-item{font-size:23px;line-height:1;background:transparent;border:0;border-radius:7px;padding:7px 3px;cursor:pointer}
.emoji-item:hover,.emoji-item:focus{background:#202b39;outline:none}
.gif-placeholder{min-height:130px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px;color:#8491a3}
.gif-placeholder strong{color:#ff8a50;font-size:.8rem;letter-spacing:.08em}
.media-picker-button.active{border-color:#ff7136!important;color:#ff9a68!important}
@media(max-width:650px){.media-picker{left:4px;bottom:70px;width:calc(100% - 8px)}.emoji-grid{grid-template-columns:repeat(7,1fr)}}

.gif-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;max-height:270px;overflow:auto}
.gif-item{position:relative;border:1px solid #2d3949;background:#080d13;border-radius:8px;padding:0;overflow:hidden;cursor:pointer;min-height:90px}
.gif-item:hover,.gif-item:focus{border-color:#ff7136;outline:none}.gif-item img{display:block;width:100%;height:110px;object-fit:contain}
.gif-item span{display:block;padding:5px 7px;color:#aeb8c6;font-size:.68rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.message-gif{display:block;max-width:min(420px,100%);max-height:320px;object-fit:contain;border-radius:9px;margin-top:7px;background:#080d13}
.gif-send-busy{opacity:.55;pointer-events:none}

/* v0.6c1 – GIF picker layout refinement */
.media-picker{
  width:min(540px,calc(100% - 16px));
}

.gif-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  max-height:300px;
}

.gif-item{
  min-height:72px;
}

.gif-item img{
  height:78px;
  object-fit:contain;
}

.gif-item span{
  padding:4px 6px;
  font-size:.64rem;
}

@media(max-width:900px){
  .media-picker{
    width:min(500px,calc(100% - 16px));
  }
  .gif-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}

@media(max-width:650px){
  .media-picker{
    width:calc(100% - 8px);
  }
  .gif-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    max-height:260px;
  }
  .gif-item img{
    height:84px;
  }
}

.image-upload-button{border:1px solid #334154;background:#18212d;color:#d5deea;border-radius:8px;font-weight:900;cursor:pointer;min-width:44px}
.image-upload-button:hover{border-color:#ff7136;color:#ff9a68}
.message-image{display:block;max-width:min(520px,100%);max-height:420px;object-fit:contain;border-radius:9px;margin-top:7px;background:#080d13}

/* v0.7a1 – keep SEND aligned when admin/mod image button exists */
.composer.composer-with-image{
  grid-template-columns:42px minmax(0,1fr) 44px auto;
}
.composer.composer-with-image .image-upload-button{
  width:44px;
  min-width:44px;
}
@media(max-width:650px){
  .composer.composer-with-image{
    grid-template-columns:42px minmax(0,1fr) 42px auto;
  }
  .composer.composer-with-image .image-upload-button{
    width:42px;
    min-width:42px;
  }
}
