/* Optional cover-only refinement. Load after dialogues.css.
   Markup: replace each .dialogue-thumb div with a type=button element,
   add .dialogue-cover and the existing data-conversation="dialogue-XX".
   Keep the real screenshot field and reader code unchanged. */
.dialogue-card .dialogue-cover{
 display:block;position:relative;flex:none;width:100%;aspect-ratio:16/9;
 padding:0;margin:0;border:0;border-bottom:1px solid #cdd7c7;border-radius:0;
 overflow:hidden;background:#e5ebdc;cursor:pointer;line-height:0;text-align:left;
 -webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.dialogue-cover img{
 display:block;width:100%;height:100%;max-width:100%;object-fit:cover;
 object-position:50% 50%;transition:transform .4s cubic-bezier(.2,.65,.2,1);
}
.dialogue-cover .dialogue-badge{
 position:absolute;top:10px;left:10px;display:flex;align-items:center;justify-content:center;
 min-height:26px;padding:5px 8px;border:1px solid #f6f4ed22;border-radius:2px;
 background:#234a3aed;color:#fffef9;font:600 11px/1.4 'Manrope',Arial,sans-serif;
 letter-spacing:.03em;box-shadow:0 2px 8px #234a3a14;pointer-events:none;
}
.dialogue-card .dialogue-cover:focus-visible{
 outline:2px solid #fffef9;outline-offset:-5px;
 box-shadow:inset 0 0 0 3px #234a3a;
}
.dialogue-covers-note{font:400 13px/1.85 'Manrope',Arial,sans-serif;color:#65735c;margin:24px 0 -14px;max-width:1000px}
@media(hover:hover){.dialogue-card:hover .dialogue-cover img{transform:scale(1.025)}}
@media(hover:none){.dialogue-card:hover .dialogue-cover img{transform:none}}
@media(max-width:760px){.dialogue-cover .dialogue-badge{top:8px;left:8px;min-height:24px;padding:4px 7px;font-size:10px}.dialogue-covers-note{font-size:13px;line-height:1.85;margin:21px 0 -8px}}
@media(prefers-reduced-motion:reduce){.dialogue-cover img{transition:none}.dialogue-card:hover .dialogue-cover img{transform:none}}
.motion-paused .dialogue-cover img{transition:none}
.motion-paused .dialogue-card:hover .dialogue-cover img{transform:none}