.jmlc-shell{
  /* CommunityHub Theme bridge — real theme variables */
  --c-bg:var(--ch-theme-bg,#f3f6fb);
  --c-panel:var(--ch-theme-surface,#ffffff);
  --c-panel2:var(--ch-theme-surface-soft,#f8fbff);
  --c-panel3:color-mix(in srgb,var(--ch-theme-blue,#0080ff) 8%,var(--ch-theme-surface,#ffffff));
  --c-line:var(--ch-theme-border,#d9e3f0);
  --c-text:var(--ch-theme-text,#101828);
  --c-muted:var(--ch-theme-muted,#667085);
  --c-faint:color-mix(in srgb,var(--ch-theme-muted,#667085) 78%,transparent);
  --c-brand:var(--ch-theme-blue,#0080ff);
  --c-brand-dark:var(--ch-theme-blue-dark,#005fcc);
  --c-good:#24864a;
  --c-bad:#c62828;
  --c-input:var(--ch-theme-surface-soft,#f8fbff);
  --c-shadow:var(--ch-theme-shadow,0 18px 50px rgba(16,24,40,.08));
  --jmlc-message-font:14px;

  width:100% !important;
  max-width:none !important;
  min-width:0 !important;
  height:clamp(540px,72vh,780px);
  margin:0 !important;
  position:relative;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  isolation:isolate;
  color:var(--c-text);
  background:var(--c-bg);
  border:1px solid var(--c-line);
  border-radius:16px;
  box-shadow:0 20px 56px rgba(0,0,0,.32);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.jmlc-shell *{box-sizing:border-box}
.jmlc-shell button,.jmlc-shell input,.jmlc-shell textarea{font:inherit}
.jmlc-shell button{touch-action:manipulation}
.jmlc-shell[hidden],.jmlc-shell [hidden]{display:none !important}

.jmlc-header{
  flex:0 0 58px;
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:0 15px;
  border-bottom:1px solid var(--c-line);
  background:var(--c-panel);
  backdrop-filter:blur(14px);
}
.jmlc-header-left,.jmlc-header-right{display:flex;align-items:center;gap:9px;min-width:0}
.jmlc-header-left strong{font-size:14px;letter-spacing:.01em}
.jmlc-menu-wrap{position:relative}
.jmlc-menu-btn{
  all:unset;
  box-sizing:border-box;
  width:32px;height:32px;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:3px;
  border:1px solid var(--c-line);
  border-radius:9px;
  background:var(--c-panel2);
  color:var(--c-text);
  cursor:pointer
}
.jmlc-menu-btn span{
  display:block;
  width:13px;height:1.5px;
  border-radius:999px;
  background:currentColor
}
.jmlc-menu-btn:hover,.jmlc-menu-btn[aria-expanded="true"]{
  background:var(--c-panel3);
  border-color:color-mix(in srgb,var(--c-brand) 50%,transparent)
}
.jmlc-menu{
  position:absolute;
  z-index:70;
  right:0;
  top:39px;
  width:260px;
  padding:8px;
  border:1px solid var(--c-line);
  border-radius:13px;
  background:var(--c-panel2);
  box-shadow:0 16px 42px rgba(0,0,0,.48)
}
.jmlc-menu-section{
  padding:9px 8px 7px;
  border-radius:9px;
  background:var(--c-panel2)
}
.jmlc-reading-title{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  margin-bottom:9px
}
.jmlc-reading-title strong{font-size:12px;color:var(--c-text)}
.jmlc-reading-title span{font-size:10px;color:var(--c-muted)}
.jmlc-font-slider{
  position:relative;
  width:100%;
  height:30px;
  display:flex;
  align-items:center;
  cursor:pointer;
  user-select:none;
  touch-action:none;
  outline:none
}
.jmlc-font-slider:focus-visible{
  border-radius:8px;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--c-brand) 50%,transparent)
}
.jmlc-font-track{
  position:relative;
  width:100%;
  height:6px;
  border-radius:999px;
  background:color-mix(in srgb,var(--c-text) 15%,transparent)
}
.jmlc-font-fill{
  position:absolute;
  inset:0 auto 0 0;
  width:25%;
  border-radius:999px;
  background:linear-gradient(90deg,var(--c-brand),var(--c-brand));
  pointer-events:none
}
.jmlc-font-thumb{
  position:absolute;
  left:25%;
  top:50%;
  width:18px;height:18px;
  transform:translate(-50%,-50%);
  border:2px solid #fff;
  border-radius:50%;
  background:var(--c-brand);
  box-shadow:0 2px 9px rgba(0,0,0,.42);
  pointer-events:none
}
.jmlc-font-stop{
  position:absolute;
  left:var(--stop);
  top:50%;
  width:5px;height:5px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:color-mix(in srgb,var(--c-text) 70%,transparent);
  pointer-events:none
}
.jmlc-reading-scale{
  display:flex;justify-content:space-between;align-items:flex-end;
  padding:1px 3px 0;color:var(--c-muted)
}
.jmlc-reading-scale span:nth-child(1){font-size:9px}
.jmlc-reading-scale span:nth-child(2){font-size:11px}
.jmlc-reading-scale span:nth-child(3){font-size:13px}
.jmlc-reading-scale span:nth-child(4){font-size:15px}
.jmlc-reading-scale span:nth-child(5){font-size:18px}
.jmlc-online-btn{
  min-height:31px;display:inline-flex;align-items:center;gap:5px;
  padding:5px 9px;border:1px solid var(--c-line);border-radius:999px;
  background:var(--c-panel2);color:var(--c-text);cursor:pointer
}
.jmlc-online-btn:hover{background:var(--c-panel3)}
.jmlc-connection{font-size:10px;color:var(--c-muted);white-space:nowrap}

.jmlc-users-panel{
  flex:0 0 auto;max-height:220px;overflow:auto;padding:7px;
  border-bottom:1px solid var(--c-line);background:var(--c-input)
}
.jmlc-user-row{display:flex;align-items:center;gap:9px;padding:8px 9px;border-radius:9px;font-size:12px}
.jmlc-user-row:hover{background:var(--c-panel2)}
.jmlc-user-dot{width:7px;height:7px;border-radius:50%;background:var(--c-good);box-shadow:0 0 7px rgba(69,201,130,.45)}
.jmlc-user-avatar{width:26px!important;height:26px!important;aspect-ratio:1/1!important;object-fit:cover!important;border-radius:50%!important}

.jmlc-gate{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:30px;text-align:center
}
.jmlc-gate-icon{font-size:38px;margin-bottom:10px}
.jmlc-gate h3{margin:0 0 8px;font-size:20px;color:var(--c-text)}
.jmlc-gate p{margin:0 0 18px;max-width:380px;color:var(--c-muted);line-height:1.5}
.jmlc-gate-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:center}
.jmlc-btn{padding:10px 16px;border-radius:10px;text-decoration:none!important;font-weight:800;font-size:13px}
.jmlc-btn-primary{background:linear-gradient(135deg,var(--c-brand),#938aff);color:white!important}
.jmlc-btn-secondary{background:var(--c-panel2);color:var(--c-text)!important;border:1px solid var(--c-line)}

.jmlc-chat{position:relative;flex:1;min-height:0;display:flex;flex-direction:column}
.jmlc-messages{
  flex:1;min-height:0;overflow-y:auto;padding:12px 12px 20px;
  scroll-behavior:smooth;overscroll-behavior:contain
}
.jmlc-messages::-webkit-scrollbar{width:7px}
.jmlc-messages::-webkit-scrollbar-thumb{background:#373749;border-radius:99px}

.jmlc-msg{
  display:grid;grid-template-columns:40px minmax(0,1fr);column-gap:10px;
  position:relative;padding:7px 8px;border-radius:12px;transition:background .12s ease
}
.jmlc-msg:hover{background:var(--c-panel2)}
.jmlc-avatar-wrap{
  width:38px!important;height:38px!important;min-width:38px!important;min-height:38px!important;
  aspect-ratio:1/1!important;align-self:start;overflow:hidden;border-radius:50%;
  border:1px solid var(--c-line);background:var(--c-panel3)
}
.jmlc-avatar{
  display:block!important;width:100%!important;height:100%!important;min-width:100%!important;max-width:100%!important;
  min-height:100%!important;max-height:100%!important;aspect-ratio:1/1!important;
  object-fit:cover!important;object-position:center!important;border-radius:0!important;margin:0!important;padding:0!important
}
.jmlc-avatar-fallback{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:900;background:linear-gradient(135deg,color-mix(in srgb,var(--c-brand) 25%,transparent),rgba(0,212,255,.15))
}
.jmlc-body{min-width:0}
.jmlc-meta{display:flex;align-items:center;gap:6px;min-height:18px;margin-bottom:3px}
.jmlc-name{font-size:13px;font-weight:800;color:var(--c-text)}
.jmlc-badge{
  font-size:8.5px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;
  padding:2px 5px;border-radius:999px;color:#d9d4ff;
  background:color-mix(in srgb,var(--c-brand) 11%,transparent);border:1px solid color-mix(in srgb,var(--c-brand) 30%,transparent)
}
.jmlc-time{font-size:9.5px;color:var(--c-faint)}
.jmlc-edited{font-size:9.5px;color:var(--c-faint);font-style:italic}
.jmlc-bubble{
  display:inline-block;max-width:min(780px,100%);padding:7px 10px;
  background:#1c1c2a;color:#f5f5fa;border:1px solid rgba(255,255,255,.04);
  border-radius:4px 12px 12px 12px;font-size:var(--jmlc-message-font);line-height:1.5;overflow-wrap:anywhere
}
.jmlc-bubble a{color:#79caff;text-decoration:underline}
.jmlc-inline-emoji{
  width:24px!important;height:24px!important;max-width:24px!important;max-height:24px!important;
  object-fit:contain!important;display:inline-block!important;vertical-align:-6px!important;margin:0 2px!important
}
.jmlc-reply-preview{
  display:block;max-width:600px;margin-bottom:5px;padding:5px 8px;border-left:2px solid var(--c-brand);
  border-radius:5px;background:color-mix(in srgb,var(--c-brand) 7%,transparent);color:var(--c-muted);font-size:11px;cursor:pointer
}
.jmlc-media{
  display:block!important;width:auto!important;height:auto!important;
  max-width:min(460px,100%)!important;max-height:320px!important;
  object-fit:contain!important;margin:7px 0 0!important;padding:0!important;
  border-radius:11px!important;border:1px solid var(--c-line)!important;background:#050508!important;
  cursor:zoom-in
}
video.jmlc-media{cursor:default}
.jmlc-msg-actions{
  display:flex;gap:2px;position:absolute;right:8px;top:4px;padding:3px;
  opacity:0;transform:translateY(-2px);border:1px solid var(--c-line);border-radius:9px;
  background:rgba(20,20,31,.96);box-shadow:0 8px 22px rgba(0,0,0,.28);transition:.14s ease
}
.jmlc-msg:hover .jmlc-msg-actions{opacity:1;transform:none}
.jmlc-msg-actions button{
  width:27px;height:25px;padding:0;border:0;border-radius:6px;background:transparent;color:var(--c-muted);cursor:pointer
}
.jmlc-msg-actions button:hover{background:var(--c-panel3);color:var(--c-text)}

.jmlc-reactions{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.jmlc-reaction{
  all:unset !important;
  box-sizing:border-box !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  width:auto !important;
  min-width:0 !important;
  height:24px !important;
  min-height:24px !important;
  max-height:24px !important;
  padding:0 7px !important;
  margin:0 !important;
  border:1px solid var(--c-line) !important;
  border-radius:999px !important;
  background:#151520 !important;
  color:var(--c-text) !important;
  font-family:inherit !important;
  font-size:13px !important;
  line-height:1 !important;
  cursor:pointer !important
}
.jmlc-reaction:hover{
  border-color:color-mix(in srgb,var(--c-brand) 55%,transparent) !important;
  background:color-mix(in srgb,var(--c-brand) 9%,transparent) !important
}
.jmlc-reaction > span{
  font-size:10px !important;
  line-height:1 !important;
  color:#c5c5d2 !important
}
.jmlc-reaction img{
  width:16px!important;height:16px!important;
  max-width:16px!important;max-height:16px!important;
  object-fit:contain!important;margin:0!important;padding:0!important
}

.jmlc-reply-bar,.jmlc-attachment-preview{
  flex:0 0 auto;border-top:1px solid var(--c-line);background:#12121c
}
.jmlc-reply-bar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 12px;color:#cbc7ff;font-size:11px
}
.jmlc-reply-label{color:var(--c-muted);margin-right:4px}
.jmlc-reply-bar button,.jmlc-attachment-preview button{border:0;background:transparent;color:var(--c-muted);cursor:pointer}
.jmlc-attachment-preview{
  display:flex;align-items:center;gap:10px;padding:8px 12px
}
.jmlc-attachment-preview [data-jmlc-attachment-thumb]{
  width:42px;height:42px;flex:0 0 42px;overflow:hidden;border-radius:8px;background:#08080d;border:1px solid var(--c-line)
}
.jmlc-attachment-preview img{width:100%!important;height:100%!important;object-fit:cover!important}
.jmlc-attachment-meta{display:flex;min-width:0;flex:1;flex-direction:column;gap:2px}
.jmlc-attachment-meta strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jmlc-attachment-meta span{font-size:10px;color:var(--c-muted)}

.jmlc-picker{
  position:absolute;left:10px;width:min(520px,calc(100% - 20px));bottom:70px;max-height:380px;overflow:auto;
  padding:10px;z-index:40;border:1px solid var(--c-line);border-radius:14px;background:var(--c-panel2);
  box-shadow:0 18px 52px rgba(0,0,0,.52)
}
.jmlc-picker-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.jmlc-gif-sticky{
  position:sticky;
  top:-10px;
  z-index:3;
  margin:-10px -10px 9px;
  padding:10px 10px 1px;
  background:linear-gradient(180deg,#14141f 84%,rgba(20,20,31,.92));
  border-bottom:1px solid rgba(255,255,255,.04)
}
.jmlc-picker-title{font-size:11px;font-weight:800;color:var(--c-muted);text-transform:uppercase;letter-spacing:.08em}
.jmlc-picker-grid{display:grid;grid-template-columns:repeat(8,minmax(36px,1fr));gap:4px}
.jmlc-picker button{min-width:0;height:40px;padding:4px;border:0;border-radius:8px;background:transparent;color:var(--c-text);cursor:pointer;font-size:20px}
.jmlc-picker button:hover{background:var(--c-panel3)}
.jmlc-picker button img{width:29px!important;height:29px!important;object-fit:contain!important;margin:0!important}
.jmlc-gif-search{
  width:100%;height:39px;padding:0 11px;margin-bottom:8px;border:1px solid var(--c-line);border-radius:9px;
  outline:none;background:var(--c-input);color:var(--c-text)
}
.jmlc-gif-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.jmlc-gif-grid button{
  all:unset;
  box-sizing:border-box;
  display:block;
  width:100%;
  height:132px;
  overflow:hidden;
  border:1px solid var(--c-line);
  border-radius:10px;
  background:
    linear-gradient(45deg,#0b0b11 25%,#0e0e15 25%,#0e0e15 50%,#0b0b11 50%,#0b0b11 75%,#0e0e15 75%);
  background-size:18px 18px;
  cursor:pointer
}
.jmlc-gif-grid button:hover{border-color:color-mix(in srgb,var(--c-brand) 55%,transparent)}
.jmlc-gif-grid button img{
  display:block!important;
  width:100%!important;height:100%!important;
  min-width:100%!important;min-height:100%!important;
  max-width:none!important;max-height:none!important;
  object-fit:contain!important;
  object-position:center!important;
  margin:0!important;padding:0!important
}
.jmlc-picker-empty{padding:20px 10px;text-align:center;color:var(--c-muted);font-size:12px}

.jmlc-composer{
  flex:0 0 auto;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:end;gap:7px;
  padding:9px 10px;border-top:1px solid var(--c-line);background:rgba(15,15,23,.98)
}
.jmlc-tool-row{display:flex;align-items:center;gap:2px}
.jmlc-tool{
  height:39px;min-width:38px;padding:0 8px;border:0;border-radius:8px;background:transparent;color:var(--c-muted);
  cursor:pointer;font-size:17px;font-weight:900
}
.jmlc-tool-text{font-size:11px;letter-spacing:.03em}
.jmlc-tool:hover{background:var(--c-panel3);color:var(--c-text)}
.jmlc-composer textarea{
  width:100%;min-height:40px;max-height:116px;padding:9px 11px;resize:none;outline:none;
  border:1px solid var(--c-line);border-radius:10px;background:var(--c-input);color:var(--c-text);line-height:1.45
}
.jmlc-composer textarea::placeholder{color:#7d7d90}
.jmlc-composer textarea:focus{border-color:color-mix(in srgb,var(--c-brand) 65%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--c-brand) 8%,transparent)}
.jmlc-send{
  width:40px;height:40px;border:0;border-radius:10px;background:linear-gradient(135deg,var(--c-brand),#948aff);
  color:white;font-weight:900;cursor:pointer;box-shadow:0 6px 18px color-mix(in srgb,var(--c-brand) 24%,transparent)
}
.jmlc-send:hover{filter:brightness(1.08)}
.jmlc-send:disabled{opacity:.45;cursor:not-allowed}

.jmlc-jump-live{
  position:absolute;right:16px;bottom:70px;padding:7px 11px;border:1px solid var(--c-line);border-radius:999px;
  background:var(--c-panel2);color:var(--c-text);cursor:pointer;box-shadow:0 7px 20px rgba(0,0,0,.36)
}

.jmlc-lightbox{
  position:absolute;inset:0;z-index:80;display:flex;align-items:center;justify-content:center;
  padding:40px;background:rgba(0,0,0,.88);backdrop-filter:blur(5px)
}
.jmlc-lightbox-close{
  position:absolute;right:13px;top:13px;width:34px;height:34px;border:1px solid rgba(255,255,255,.15);
  border-radius:50%;background:rgba(20,20,28,.9);color:var(--c-text);cursor:pointer
}
.jmlc-lightbox img,.jmlc-lightbox video{
  max-width:100%!important;max-height:100%!important;width:auto!important;height:auto!important;object-fit:contain!important
}
.jmlc-toast{
  position:absolute;left:50%;bottom:76px;z-index:90;transform:translateX(-50%);
  max-width:calc(100% - 24px);padding:8px 12px;border:1px solid var(--c-line);border-radius:9px;
  background:var(--c-panel2);color:var(--c-text);font-size:11px;box-shadow:0 8px 25px rgba(0,0,0,.38)
}
.jmlc-toast.error{border-color:rgba(255,91,104,.35);color:#ffb0b7}

@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  .jmlc-shell{
    height:clamp(520px,75dvh,760px);
    border-radius:12px;
  }
  .jmlc-header{padding:0 10px}
  .jmlc-messages{padding:9px 6px 16px}
  .jmlc-msg{grid-template-columns:36px minmax(0,1fr);column-gap:7px;padding:7px 5px}
  .jmlc-avatar-wrap{width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important}
  .jmlc-msg-actions{
    position:static;display:inline-flex;opacity:1;transform:none;margin-top:5px;box-shadow:none
  }
  .jmlc-picker{left:7px;width:calc(100% - 14px);bottom:108px}
  .jmlc-picker-grid{grid-template-columns:repeat(6,1fr)}
  .jmlc-composer{grid-template-columns:minmax(0,1fr) auto;padding:8px}
  .jmlc-tool-row{grid-column:1/-1}
  .jmlc-gif-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .jmlc-gif-grid button{height:118px}
  .jmlc-media{max-width:100%!important;max-height:300px!important}
}
@media(max-width:420px){
  .jmlc-shell{height:calc(100dvh - 150px);min-height:500px}
  .jmlc-picker-grid{grid-template-columns:repeat(5,1fr)}
  .jmlc-connection{display:none}
}


/* v0.2.5 picker + font-control hardening */
.jmlc-font-slider{position:relative}
.jmlc-font-hits{
  position:absolute;
  inset:0;
  z-index:5;
  display:grid;
  grid-template-columns:repeat(5,1fr);
  pointer-events:auto
}
.jmlc-font-hits button{
  all:unset !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  cursor:pointer !important;
}
.jmlc-picker.is-reaction{
  width:min(310px,calc(100% - 16px));
  max-height:230px;
  padding:8px;
}
.jmlc-picker.is-reaction .jmlc-picker-grid{
  grid-template-columns:repeat(6,minmax(34px,1fr));
}
.jmlc-picker.is-reaction .jmlc-picker-head{
  margin-bottom:5px;
}


/* v0.2.6 hard-scoped reading sizes */
.jmlc-shell.jmlc-font-1 .jmlc-bubble{font-size:13px!important}
.jmlc-shell.jmlc-font-2 .jmlc-bubble{font-size:14px!important}
.jmlc-shell.jmlc-font-3 .jmlc-bubble{font-size:15px!important}
.jmlc-shell.jmlc-font-4 .jmlc-bubble{font-size:16px!important}
.jmlc-shell.jmlc-font-5 .jmlc-bubble{font-size:18px!important}

.jmlc-shell.jmlc-font-1 .jmlc-name{font-size:13px!important}
.jmlc-shell.jmlc-font-2 .jmlc-name{font-size:13.5px!important}
.jmlc-shell.jmlc-font-3 .jmlc-name{font-size:14px!important}
.jmlc-shell.jmlc-font-4 .jmlc-name{font-size:15px!important}
.jmlc-shell.jmlc-font-5 .jmlc-name{font-size:16px!important}

/* Five direct hit areas so the control always works even under aggressive theme CSS */
.jmlc-font-hits{pointer-events:auto!important}
.jmlc-font-hits button{pointer-events:auto!important;cursor:pointer!important}

/* Preserve transparent GIFs but allow a display background without modifying animation */
.jmlc-asset-bg-white{background:#fff!important;border-radius:5px}
.jmlc-asset-bg-black{background:#000!important;border-radius:5px}
.jmlc-asset-bg-transparent{background:transparent!important}

/* reaction picker should stay local to clicked message */
.jmlc-picker.is-reaction{
  position:absolute!important;
  z-index:60!important;
}


/* v0.2.7: never let message action menus compete with the chat settings menu */
.jmlc-shell.jmlc-menu-open .jmlc-msg-actions{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.jmlc-shell.jmlc-menu-open .jmlc-msg:hover .jmlc-msg-actions{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.jmlc-menu{
  pointer-events:auto!important;
  background:var(--c-panel2)!important;
}


/* v0.2.8 full phone-style emoji keyboard */
.jmlc-picker.is-emoji-keyboard{
  width:min(540px,calc(100% - 20px));
  max-height:390px;
  padding:0;
  overflow:auto;
  scrollbar-gutter:stable;
}
.jmlc-emoji-sticky{
  position:sticky;
  top:0;
  z-index:5;
  padding:10px 10px 7px;
  background:var(--c-panel2);
  border-bottom:1px solid var(--c-line);
}
.jmlc-emoji-search{
  width:100%;
  height:38px;
  padding:0 11px;
  margin:0 0 8px;
  border:1px solid var(--c-line)!important;
  border-radius:10px!important;
  outline:none!important;
  background:var(--c-input)!important;
  color:var(--c-text)!important;
  box-shadow:none!important;
}
.jmlc-emoji-search::placeholder{color:#77778b}
.jmlc-emoji-tabs{
  display:flex;
  align-items:center;
  gap:3px;
  overflow-x:auto;
  padding-bottom:2px;
  scrollbar-width:none;
}
.jmlc-emoji-tabs::-webkit-scrollbar{display:none}
.jmlc-emoji-tab{
  all:unset!important;
  box-sizing:border-box!important;
  flex:0 0 38px!important;
  width:38px!important;
  height:34px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:8px!important;
  color:#d6d6df!important;
  cursor:pointer!important;
  font-size:18px!important;
  line-height:1!important;
}
.jmlc-emoji-tab:hover{background:var(--c-panel3)!important}
.jmlc-emoji-tab.is-active{
  background:color-mix(in srgb,var(--c-brand) 18%,transparent)!important;
  box-shadow:inset 0 -2px 0 var(--c-brand)!important;
}
.jmlc-emoji-content{
  display:grid;
  grid-template-columns:repeat(8,minmax(38px,1fr));
  gap:2px;
  padding:8px 9px 12px;
}
.jmlc-emoji-key{
  all:unset!important;
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:0!important;
  height:43px!important;
  border-radius:8px!important;
  cursor:pointer!important;
  font-size:25px!important;
  line-height:1!important;
}
.jmlc-emoji-key:hover{
  background:var(--c-panel3)!important;
}
.jmlc-emoji-key img{
  width:32px!important;
  height:32px!important;
  max-width:32px!important;
  max-height:32px!important;
  object-fit:contain!important;
  margin:0!important;
}
@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  .jmlc-picker.is-emoji-keyboard{
    width:calc(100% - 14px);
    max-height:46vh;
  }
  .jmlc-emoji-content{
    grid-template-columns:repeat(7,minmax(36px,1fr));
  }
}
@media(max-width:430px){
  .jmlc-emoji-content{
    grid-template-columns:repeat(6,minmax(34px,1fr));
  }
  .jmlc-emoji-key{height:41px!important;font-size:23px!important}
}


/* v0.3.0 reliable font slider */
.jmlc-font-slider{
  position:relative!important;
  width:100%!important;
  height:38px!important;
  display:flex!important;
  align-items:center!important;
  cursor:ew-resize!important;
  touch-action:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  pointer-events:auto!important;
}
.jmlc-font-track{
  position:relative!important;
  width:100%!important;
  height:8px!important;
  border-radius:999px!important;
  cursor:ew-resize!important;
  pointer-events:none!important;
}
.jmlc-font-thumb{
  width:20px!important;
  height:20px!important;
}
.jmlc-font-hits{display:none!important}


/* v0.3.1 font slider: native range owns all interaction */
.jmlc-font-slider{
  position:relative!important;
  width:100%!important;
  height:40px!important;
  display:flex!important;
  align-items:center!important;
  pointer-events:auto!important;
}
.jmlc-font-track{
  position:absolute!important;
  left:0!important;
  right:0!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:100%!important;
  height:8px!important;
  pointer-events:none!important;
}
.jmlc-font-native-range{
  -webkit-appearance:auto!important;
  appearance:auto!important;
  position:absolute!important;
  inset:0!important;
  z-index:10!important;
  display:block!important;
  width:100%!important;
  height:40px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  opacity:0!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  touch-action:pan-y!important;
}
.jmlc-font-native-range::-webkit-slider-thumb{
  cursor:pointer!important;
}
.jmlc-font-native-range::-moz-range-thumb{
  cursor:pointer!important;
}


/* v0.3.2 regression recovery: one visible native slider, no overlay */
.jmlc-font-slider{
  position:relative!important;
  width:100%!important;
  height:42px!important;
  display:flex!important;
  align-items:center!important;
  overflow:visible!important;
  pointer-events:auto!important;
}
.jmlc-font-native-range{
  position:static!important;
  inset:auto!important;
  z-index:auto!important;
  display:block!important;
  width:100%!important;
  height:auto!important;
  min-height:24px!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  opacity:1!important;
  visibility:visible!important;
  pointer-events:auto!important;
  cursor:pointer!important;
  touch-action:auto!important;
  accent-color:var(--c-brand);
}
.jmlc-font-position{
  margin-top:4px;
  text-align:center;
  color:var(--c-muted);
  font-size:10px;
  font-weight:700;
}


/* v0.3.3 — CommunityHub semantic light/dark integration */
.jmlc-shell{
  color-scheme:inherit;
  background:var(--c-bg)!important;
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
}
.jmlc-header{
  background:var(--c-panel)!important;
  border-color:var(--c-line)!important;
}
.jmlc-menu{
  background:var(--c-panel2)!important;
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
}
.jmlc-menu-section{
  background:var(--c-panel)!important;
}
.jmlc-menu-btn,
.jmlc-online-btn,
.jmlc-tool,
.jmlc-msg-actions button{
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
}
.jmlc-menu-btn:hover,
.jmlc-menu-btn[aria-expanded="true"],
.jmlc-online-btn:hover,
.jmlc-tool:hover{
  background:var(--c-panel3)!important;
  border-color:var(--c-brand)!important;
}
.jmlc-reading-title strong,
.jmlc-name,
.jmlc-picker,
.jmlc-picker button{
  color:var(--c-text)!important;
}
.jmlc-picker,
.jmlc-emoji-sticky{
  background:var(--c-panel2)!important;
  border-color:var(--c-line)!important;
}
.jmlc-emoji-search,
.jmlc-gif-search,
.jmlc-composer textarea{
  background:var(--c-input)!important;
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
}
.jmlc-emoji-search:focus,
.jmlc-gif-search:focus,
.jmlc-composer textarea:focus{
  border-color:var(--c-brand)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--c-brand) 12%,transparent)!important;
}
.jmlc-font-slider{
  position:relative!important;
  width:100%!important;
  height:42px!important;
  display:flex!important;
  align-items:center!important;
  cursor:ew-resize!important;
  touch-action:none!important;
  user-select:none!important;
  -webkit-user-select:none!important;
  pointer-events:auto!important;
}
.jmlc-font-track{
  position:relative!important;
  width:100%!important;
  height:8px!important;
  border-radius:999px!important;
  background:color-mix(in srgb,var(--c-text) 16%,transparent)!important;
  pointer-events:none!important;
}
.jmlc-font-fill{
  position:absolute!important;
  left:0!important;
  top:0!important;
  bottom:0!important;
  width:25%;
  border-radius:999px!important;
  background:var(--c-brand)!important;
  pointer-events:none!important;
}
.jmlc-font-thumb{
  position:absolute!important;
  left:25%;
  top:50%!important;
  width:20px!important;
  height:20px!important;
  transform:translate(-50%,-50%)!important;
  border:2px solid var(--c-panel)!important;
  border-radius:50%!important;
  background:var(--c-brand)!important;
  box-shadow:0 2px 8px color-mix(in srgb,var(--c-text) 22%,transparent)!important;
  pointer-events:none!important;
}
.jmlc-font-stop{
  background:color-mix(in srgb,var(--c-text) 65%,transparent)!important;
}
.jmlc-font-slider:focus-visible{
  outline:2px solid var(--c-brand)!important;
  outline-offset:2px!important;
  box-shadow:none!important;
}
.jmlc-reading-scale,
.jmlc-font-position{
  color:var(--c-muted)!important;
}


/* =========================================================
   v0.3.4 — CommunityHub dual-mode color audit
   Uses the real CommunityHub Theme token family.
   Covers default / hover / focus / active / disabled /
   dropdown / picker / popup states.
   ========================================================= */

/* Dark fallback values are only used if the Theme token itself is absent. */
html[data-ch-theme-mode="dark"] .jmlc-shell,
body.ch-theme-mode-dark .jmlc-shell,
body.ch-theme-dark .jmlc-shell{
  --c-bg:var(--ch-theme-bg,#0b1422);
  --c-panel:var(--ch-theme-surface,#121c2b);
  --c-panel2:var(--ch-theme-surface-soft,#172235);
  --c-panel3:color-mix(in srgb,var(--ch-theme-blue,#0080ff) 14%,var(--ch-theme-surface,#121c2b));
  --c-line:var(--ch-theme-border,#26364d);
  --c-text:var(--ch-theme-text,#f5f7fb);
  --c-muted:var(--ch-theme-muted,#94a3b8);
  --c-faint:color-mix(in srgb,var(--ch-theme-muted,#94a3b8) 82%,transparent);
  --c-brand:var(--ch-theme-blue,#0080ff);
  --c-brand-dark:var(--ch-theme-blue-dark,#5aaeff);
  --c-input:var(--ch-theme-surface-soft,#172235);
  --c-shadow:var(--ch-theme-shadow,0 18px 60px rgba(0,0,0,.35));
}

/* Shell / structural surfaces */
.jmlc-shell,
.jmlc-header,
.jmlc-users-panel,
.jmlc-composer,
.jmlc-reply-bar,
.jmlc-attachment-preview{
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
}
.jmlc-shell{background:var(--c-bg)!important}
.jmlc-header{background:var(--c-panel)!important}
.jmlc-users-panel,
.jmlc-composer,
.jmlc-reply-bar,
.jmlc-attachment-preview{background:var(--c-panel)!important}

/* The settings popup must always sit above LIVE Chat message controls. */
.jmlc-menu{
  z-index:100000!important;
  background:var(--c-panel)!important;
  color:var(--c-text)!important;
  border:1px solid var(--c-line)!important;
  box-shadow:var(--c-shadow)!important;
}
.jmlc-menu-section{
  background:var(--c-panel2)!important;
  color:var(--c-text)!important;
  border:1px solid color-mix(in srgb,var(--c-line) 70%,transparent)!important;
}
.jmlc-menu *,
.jmlc-reading-title strong{
  color:inherit;
}
.jmlc-reading-title span,
.jmlc-reading-scale,
.jmlc-font-position{
  color:var(--c-muted)!important;
}

/* Kill any message/comment action overlay while settings are open.
   display:none prevents an invisible/dark action shell from covering the slider. */
.jmlc-shell.jmlc-menu-open .jmlc-msg-actions,
.jmlc-shell.jmlc-menu-open .jmlc-msg:hover .jmlc-msg-actions{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}

/* Header/menu controls */
.jmlc-menu-btn,
.jmlc-online-btn,
.jmlc-tool{
  background:var(--c-panel2)!important;
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
}
.jmlc-menu-btn:hover,
.jmlc-menu-btn:focus-visible,
.jmlc-menu-btn[aria-expanded="true"],
.jmlc-online-btn:hover,
.jmlc-online-btn:focus-visible,
.jmlc-tool:hover,
.jmlc-tool:focus-visible{
  background:var(--c-panel3)!important;
  color:var(--c-text)!important;
  border-color:var(--c-brand)!important;
}
.jmlc-menu-btn:focus-visible,
.jmlc-online-btn:focus-visible,
.jmlc-tool:focus-visible{
  outline:2px solid var(--c-brand)!important;
  outline-offset:2px!important;
}
.jmlc-connection{color:var(--c-muted)!important}

/* Messages */
.jmlc-msg{color:var(--c-text)!important}
.jmlc-msg:hover{background:var(--c-panel2)!important}
.jmlc-name{color:var(--c-text)!important}
.jmlc-time,
.jmlc-edited{color:var(--c-muted)!important}

.jmlc-bubble{
  background:var(--c-panel)!important;
  color:var(--c-text)!important;
  border:1px solid var(--c-line)!important;
}
.jmlc-bubble a{
  color:var(--c-brand)!important;
}
.jmlc-bubble a:hover{
  color:var(--c-brand-dark)!important;
}
.jmlc-reply-preview{
  background:color-mix(in srgb,var(--c-brand) 8%,var(--c-panel))!important;
  color:var(--c-muted)!important;
  border-left-color:var(--c-brand)!important;
}

/* Message action popup */
.jmlc-msg-actions{
  z-index:50!important;
  background:var(--c-panel)!important;
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
  box-shadow:var(--c-shadow)!important;
}
.jmlc-msg-actions button{
  background:transparent!important;
  color:var(--c-muted)!important;
  border-color:transparent!important;
}
.jmlc-msg-actions button:hover,
.jmlc-msg-actions button:focus-visible{
  background:var(--c-panel3)!important;
  color:var(--c-text)!important;
}
.jmlc-msg-actions button:focus-visible{
  outline:2px solid var(--c-brand)!important;
  outline-offset:1px!important;
}

/* Reactions */
.jmlc-reaction{
  background:var(--c-panel2)!important;
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
}
.jmlc-reaction > span{color:var(--c-muted)!important}
.jmlc-reaction:hover,
.jmlc-reaction:focus-visible{
  background:var(--c-panel3)!important;
  border-color:var(--c-brand)!important;
  color:var(--c-text)!important;
}
.jmlc-reaction:focus-visible{
  outline:2px solid var(--c-brand)!important;
  outline-offset:1px!important;
}

/* Reply / attachment UI */
.jmlc-reply-bar{color:var(--c-text)!important}
.jmlc-reply-label,
.jmlc-attachment-meta span{color:var(--c-muted)!important}
.jmlc-reply-bar button,
.jmlc-attachment-preview button{
  color:var(--c-muted)!important;
}
.jmlc-reply-bar button:hover,
.jmlc-attachment-preview button:hover{
  color:var(--c-text)!important;
}
.jmlc-attachment-preview [data-jmlc-attachment-thumb]{
  background:var(--c-panel2)!important;
  border-color:var(--c-line)!important;
}

/* Emoji / GIF / reaction pickers */
.jmlc-picker,
.jmlc-emoji-sticky,
.jmlc-gif-sticky{
  background:var(--c-panel)!important;
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
}
.jmlc-gif-sticky{
  background:var(--c-panel)!important;
  border-bottom:1px solid var(--c-line)!important;
}
.jmlc-picker-title{color:var(--c-muted)!important}
.jmlc-picker button,
.jmlc-emoji-tab,
.jmlc-emoji-key{
  color:var(--c-text)!important;
}
.jmlc-picker button:hover,
.jmlc-picker button:focus-visible,
.jmlc-emoji-tab:hover,
.jmlc-emoji-tab:focus-visible,
.jmlc-emoji-key:hover,
.jmlc-emoji-key:focus-visible{
  background:var(--c-panel3)!important;
  color:var(--c-text)!important;
}
.jmlc-emoji-tab.is-active{
  background:color-mix(in srgb,var(--c-brand) 16%,var(--c-panel))!important;
  color:var(--c-text)!important;
  box-shadow:inset 0 -2px 0 var(--c-brand)!important;
}
.jmlc-picker button:focus-visible,
.jmlc-emoji-tab:focus-visible,
.jmlc-emoji-key:focus-visible{
  outline:2px solid var(--c-brand)!important;
  outline-offset:1px!important;
}
.jmlc-picker-empty{color:var(--c-muted)!important}

/* Inputs */
.jmlc-emoji-search,
.jmlc-gif-search,
.jmlc-composer textarea{
  background:var(--c-input)!important;
  color:var(--c-text)!important;
  border:1px solid var(--c-line)!important;
}
.jmlc-emoji-search::placeholder,
.jmlc-gif-search::placeholder,
.jmlc-composer textarea::placeholder{
  color:var(--c-muted)!important;
  opacity:.9!important;
}
.jmlc-emoji-search:focus,
.jmlc-gif-search:focus,
.jmlc-composer textarea:focus{
  outline:none!important;
  border-color:var(--c-brand)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--c-brand) 14%,transparent)!important;
}

/* GIF transparency preview checker uses theme surfaces, never forced black. */
.jmlc-gif-grid button{
  border-color:var(--c-line)!important;
  background:
    linear-gradient(45deg,
      var(--c-panel2) 25%,var(--c-panel) 25%,
      var(--c-panel) 50%,var(--c-panel2) 50%,
      var(--c-panel2) 75%,var(--c-panel) 75%)!important;
  background-size:18px 18px!important;
}
.jmlc-gif-grid button:hover,
.jmlc-gif-grid button:focus-visible{
  border-color:var(--c-brand)!important;
}

/* Composer/send */
.jmlc-send{
  background:linear-gradient(135deg,var(--c-brand),var(--c-brand-dark))!important;
  color:#fff!important;
}
.jmlc-send:hover{filter:brightness(1.05)}
.jmlc-send:focus-visible{
  outline:2px solid var(--c-brand)!important;
  outline-offset:2px!important;
}
.jmlc-send:disabled{
  opacity:.48!important;
  cursor:not-allowed!important;
  filter:none!important;
}

/* Font control — preserve working interaction; audit visuals only. */
.jmlc-font-track{
  background:color-mix(in srgb,var(--c-text) 18%,var(--c-panel2))!important;
}
.jmlc-font-fill{
  background:var(--c-brand)!important;
}
.jmlc-font-thumb{
  background:var(--c-brand)!important;
  border-color:var(--c-panel)!important;
  box-shadow:0 2px 8px color-mix(in srgb,var(--c-text) 22%,transparent)!important;
}
.jmlc-font-stop{
  background:color-mix(in srgb,var(--c-text) 62%,var(--c-panel))!important;
}
.jmlc-font-slider:focus-visible{
  outline:2px solid var(--c-brand)!important;
  outline-offset:2px!important;
}

/* Badges/status */
.jmlc-badge{
  color:var(--c-brand-dark)!important;
  background:color-mix(in srgb,var(--c-brand) 10%,var(--c-panel))!important;
  border-color:color-mix(in srgb,var(--c-brand) 35%,var(--c-line))!important;
}
.jmlc-user-dot{background:var(--c-good)!important}
.jmlc-toast{
  background:var(--c-panel)!important;
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
  box-shadow:var(--c-shadow)!important;
}
.jmlc-toast.error{
  background:color-mix(in srgb,var(--c-bad) 8%,var(--c-panel))!important;
  color:var(--c-bad)!important;
  border-color:color-mix(in srgb,var(--c-bad) 45%,var(--c-line))!important;
}

/* Gate buttons */
.jmlc-btn-primary{
  background:linear-gradient(135deg,var(--c-brand),var(--c-brand-dark))!important;
  color:#fff!important;
}
.jmlc-btn-secondary{
  background:var(--c-panel2)!important;
  color:var(--c-text)!important;
  border-color:var(--c-line)!important;
}

/* Scrollbars */
.jmlc-messages::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--c-muted) 52%,transparent)!important;
}
.jmlc-picker,
.jmlc-users-panel,
.jmlc-messages{
  scrollbar-color:color-mix(in srgb,var(--c-muted) 52%,transparent) transparent;
}

/* Media surfaces. Black/white custom asset backgrounds remain intentional choices. */
.jmlc-media{
  background:var(--c-panel2)!important;
  border-color:var(--c-line)!important;
}
.jmlc-lightbox{
  background:rgba(0,0,0,.88)!important;
}
.jmlc-lightbox-close{
  background:rgba(20,20,28,.92)!important;
  color:#fff!important;
  border-color:rgba(255,255,255,.18)!important;
}

/* Mobile parity */
@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  .jmlc-msg-actions{
    background:var(--c-panel2)!important;
    color:var(--c-text)!important;
    border-color:var(--c-line)!important;
  }
  .jmlc-shell.jmlc-menu-open .jmlc-msg-actions{
    display:none!important;
  }
}


/* v0.3.5 admin-only Clear Chat */
.jmlc-admin-chat-controls{
  border-top:1px solid var(--c-line)!important;
}
.jmlc-clear-chat-btn{
  all:unset!important;
  box-sizing:border-box!important;
  width:100%!important;
  min-height:40px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  padding:8px 12px!important;
  border:1px solid color-mix(in srgb,var(--c-bad) 55%,var(--c-line))!important;
  border-radius:9px!important;
  background:color-mix(in srgb,var(--c-bad) 8%,var(--c-panel))!important;
  color:var(--c-bad)!important;
  font-weight:800!important;
  cursor:pointer!important;
}
.jmlc-clear-chat-btn:hover,
.jmlc-clear-chat-btn:focus-visible{
  background:color-mix(in srgb,var(--c-bad) 14%,var(--c-panel))!important;
  border-color:var(--c-bad)!important;
  color:var(--c-bad)!important;
}
.jmlc-clear-chat-btn:focus-visible{
  outline:2px solid var(--c-bad)!important;
  outline-offset:2px!important;
}
.jmlc-clear-chat-note{
  margin:7px 0 0!important;
  color:var(--c-muted)!important;
  font-size:10px!important;
  line-height:1.35!important;
}


/* =========================================================
   v0.3.6 — Header/menu stacking-context fix
   The header itself must sit above scrolling message media.
   ========================================================= */
.jmlc-header{
  position:relative!important;
  z-index:1000!important;
  overflow:visible!important;
  isolation:isolate;
}
.jmlc-header-right{
  position:relative!important;
  z-index:1001!important;
  overflow:visible!important;
}
.jmlc-menu-wrap{
  position:relative!important;
  z-index:1002!important;
  overflow:visible!important;
}
.jmlc-menu{
  z-index:1003!important;
}

/* Explicitly keep scroll/media layers beneath the header context. */
.jmlc-messages{
  position:relative!important;
  z-index:1!important;
}
.jmlc-msg,
.jmlc-reply-preview,
.jmlc-media,
.jmlc-reactions{
  z-index:auto!important;
}
.jmlc-composer{
  position:relative!important;
  z-index:20!important;
}

/* While menu is open, nothing inside scrolling messages may establish
   a competing layer above the header/menu. */
.jmlc-shell.jmlc-menu-open .jmlc-messages,
.jmlc-shell.jmlc-menu-open .jmlc-msg,
.jmlc-shell.jmlc-menu-open .jmlc-reply-preview,
.jmlc-shell.jmlc-menu-open .jmlc-media,
.jmlc-shell.jmlc-menu-open .jmlc-reactions{
  z-index:0!important;
}

.jmlc-clear-chat-btn:disabled,
.jmlc-clear-chat-btn[aria-busy="true"]{
  opacity:.58!important;
  cursor:wait!important;
  pointer-events:none!important;
}


/* =========================================================
   v0.3.7 — Livestream donation button
   ========================================================= */
.jmlc-donate-btn{
  box-sizing:border-box!important;
  min-height:34px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  padding:5px 10px!important;
  border:1px solid color-mix(in srgb,var(--c-brand) 60%,var(--c-line))!important;
  border-radius:9px!important;
  background:color-mix(in srgb,var(--c-brand) 10%,var(--c-panel))!important;
  color:var(--c-text)!important;
  text-decoration:none!important;
  font-size:12px!important;
  font-weight:800!important;
  line-height:1!important;
  white-space:nowrap!important;
  cursor:pointer!important;
  transition:background .15s ease,border-color .15s ease,transform .15s ease!important;
}
.jmlc-donate-btn:hover{
  background:color-mix(in srgb,var(--c-brand) 18%,var(--c-panel))!important;
  border-color:var(--c-brand)!important;
  color:var(--c-text)!important;
  text-decoration:none!important;
  transform:translateY(-1px);
}
.jmlc-donate-btn:focus-visible{
  outline:2px solid var(--c-brand)!important;
  outline-offset:2px!important;
}
.jmlc-donate-symbol{
  width:20px!important;
  height:20px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 20px!important;
  border-radius:50%!important;
  background:var(--c-brand)!important;
  color:#fff!important;
  font-size:13px!important;
  font-weight:900!important;
}
.jmlc-donate-label{
  color:inherit!important;
}
@media(max-width:520px){
  .jmlc-donate-btn{
    min-width:34px!important;
    width:34px!important;
    height:34px!important;
    padding:0!important;
    border-radius:50%!important;
  }
  .jmlc-donate-label{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    overflow:hidden!important;
    clip:rect(0 0 0 0)!important;
    white-space:nowrap!important;
  }
  .jmlc-donate-symbol{
    width:auto!important;
    height:auto!important;
    flex:0 0 auto!important;
    background:transparent!important;
    color:var(--c-text)!important;
    font-size:16px!important;
  }
}


/* =========================================================
   v0.3.20 — clean mobile geometry
   ========================================================= */
.jmlc-content-stack{max-width:100%}
.jmlc-shell{isolation:isolate!important}
.jmlc-header{position:relative!important;z-index:1000!important;overflow:visible!important}
.jmlc-header-right{position:relative!important;z-index:1001!important;overflow:visible!important}
.jmlc-menu-wrap{position:relative!important;z-index:1002!important;overflow:visible!important}
.jmlc-menu{z-index:1003!important}
.jmlc-users-panel{position:relative!important;z-index:900!important}
.jmlc-messages{position:relative!important;z-index:1!important}
.jmlc-media,.jmlc-inline-emoji{position:relative!important;z-index:1!important}
.jmlc-composer{position:relative!important;z-index:30!important}
.jmlc-jump-live{z-index:40!important}
.jmlc-lightbox{z-index:2000!important}
.jmlc-emoji-key,.jmlc-emoji-tab,.jmlc-reaction,.jmlc-tool[data-jmlc-emoji]{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif!important}
.jmlc-picker.jmlc-viewport-picker{
  position:fixed!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;
  margin:0!important;padding:10px!important;overflow:auto!important;contain:none!important;border-radius:14px!important;
  z-index:2147483000!important;box-shadow:0 22px 70px rgba(0,0,0,.52)!important
}
.jmlc-picker.jmlc-viewport-picker.is-emoji-keyboard{padding:0!important}

@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  .jmlc-shell{height:80vh!important;min-height:0!important;max-height:80vh!important;margin-bottom:0!important;border-radius:12px!important}
  .jmlc-composer textarea{scroll-margin:0!important;scroll-padding:0!important}
  .jmlc-content-stack{display:flex!important;flex-direction:column!important;align-items:flex-start!important;width:fit-content!important;max-width:100%!important}
  .jmlc-content-stack .jmlc-reactions:empty{display:none!important;margin:0!important}
  .jmlc-content-stack .jmlc-reactions:not(:empty){margin:3px 0 0!important}
  .jmlc-content-stack .jmlc-msg-actions{
    position:static!important;align-self:flex-end!important;display:flex!important;width:max-content!important;max-width:100%!important;
    margin:2px 0 0!important;padding:2px!important;gap:1px!important;opacity:1!important;visibility:visible!important;
    transform:none!important;box-shadow:none!important
  }
  .jmlc-media{max-width:min(100%,270px)!important;max-height:225px!important;width:auto!important;height:auto!important;object-fit:contain!important}
  .jmlc-jump-live{right:10px!important;bottom:calc(var(--jmlc-bottom-ui,72px) + 8px)!important}
  .jmlc-picker.jmlc-viewport-picker{max-width:calc(100vw - 20px)!important}
  .jmlc-picker.jmlc-viewport-picker .jmlc-gif-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .jmlc-picker.jmlc-viewport-picker .jmlc-gif-grid button{height:128px!important}
}
@media(max-width:420px){.jmlc-shell{height:80vh!important;min-height:0!important;max-height:80vh!important}}

/* =========================================================
   v0.4.2 — unified LIVE Stage
   Desktop: player and chat are equal-height columns. The player
   iframe fills the entire stage height so there is no separate
   black stage area beneath it. Mobile remains one stack.
   ========================================================= */
.jmlc-stage{
  --jmlc-stage-chat-width:360px;
  --jmlc-stage-player-mobile:26%;
  width:100%;
  max-width:1180px;
  height:clamp(540px,68vh,660px);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,var(--jmlc-stage-chat-width));
  align-items:stretch;
  background:#000;
  overflow:hidden;
  isolation:isolate;
}
.jmlc-stage-player{
  position:relative;
  min-width:0;
  min-height:0;
  height:100%;
  overflow:hidden;
  background:#000;
  display:flex;
  align-items:stretch;
  justify-content:center;
}
.jmlc-stage-video{
  position:relative;
  width:100%;
  max-width:100%;
  height:100%;
  min-height:0;
  aspect-ratio:auto;
  overflow:hidden;
  background:#000;
  flex:1 1 auto;
}
.jmlc-stage-video iframe{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  max-height:none!important;
  border:0!important;
  margin:0!important;
  padding:0!important;
}
.jmlc-stage-chat{
  min-width:0;
  min-height:0;
  height:100%;
  display:flex;
  overflow:hidden;
}
.jmlc-stage .jmlc-shell{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  border-radius:0!important;
  box-shadow:none!important;
}


/* =========================================================
   v0.5.0 — Smart Hooligan Bot presentation
   ========================================================= */
.jmlc-bot-badge{
  display:inline-flex;
  align-items:center;
  min-height:18px;
  padding:1px 6px;
  border:1px solid color-mix(in srgb,var(--c-brand) 60%,transparent);
  border-radius:999px;
  background:color-mix(in srgb,var(--c-brand) 16%,var(--c-panel2));
  color:var(--c-text);
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  line-height:1;
}
.jmlc-bot-message .jmlc-avatar-fallback{
  border-color:color-mix(in srgb,var(--c-brand) 72%,var(--c-line));
  box-shadow:0 0 0 2px color-mix(in srgb,var(--c-brand) 14%,transparent);
}
.jmlc-bot-message .jmlc-bubble{
  border-color:color-mix(in srgb,var(--c-brand) 34%,var(--c-line));
}
.jmlc-bot-menu-note{
  margin:8px 0 0;
  color:var(--c-muted);
  font-size:12px;
  line-height:1.45;
}
.jmlc-bot-menu-note code{
  color:var(--c-text);
  font-weight:800;
}


/* =========================================================
   v0.5.1 — Smart Hooligan Bot polish
   Presentation only. LIVE Stage / keyboard geometry untouched.
   ========================================================= */
.jmlc-bot-message .jmlc-name{
  font-weight:900;
  letter-spacing:.01em;
}
.jmlc-bot-avatar{
  position:relative;
  display:grid!important;
  place-items:center;
  overflow:visible!important;
  border:1px solid color-mix(in srgb,var(--c-brand) 78%,#ffffff 10%)!important;
  background:
    radial-gradient(circle at 35% 28%,rgba(255,255,255,.22),transparent 30%),
    linear-gradient(145deg,color-mix(in srgb,var(--c-brand) 86%,#07101f),#0d1a32 72%)!important;
  box-shadow:
    0 0 0 2px color-mix(in srgb,var(--c-brand) 13%,transparent),
    0 4px 14px rgba(0,0,0,.22)!important;
  color:#fff!important;
}
.jmlc-bot-avatar-mark{
  font-size:15px;
  font-weight:1000;
  line-height:1;
  text-shadow:0 1px 2px rgba(0,0,0,.35);
}
.jmlc-bot-avatar-bolt{
  position:absolute;
  right:-5px;
  bottom:-4px;
  display:grid;
  place-items:center;
  width:15px;
  height:15px;
  border:2px solid var(--c-panel);
  border-radius:999px;
  background:#f7c948;
  color:#111827;
  font-size:9px;
  line-height:1;
  box-shadow:0 2px 5px rgba(0,0,0,.25);
}
.jmlc-bot-message .jmlc-bubble{
  position:relative;
  white-space:pre-line;
  line-height:1.48;
  border-color:color-mix(in srgb,var(--c-brand) 42%,var(--c-line))!important;
  background:
    linear-gradient(135deg,color-mix(in srgb,var(--c-brand) 10%,var(--c-panel2)),var(--c-panel2) 58%)!important;
  box-shadow:inset 3px 0 0 color-mix(in srgb,var(--c-brand) 72%,transparent);
}
.jmlc-bot-message .jmlc-bubble strong{
  font-weight:900;
}
.jmlc-bot-badge{
  border-color:color-mix(in srgb,var(--c-brand) 72%,transparent);
  background:linear-gradient(180deg,color-mix(in srgb,var(--c-brand) 27%,var(--c-panel2)),color-mix(in srgb,var(--c-brand) 12%,var(--c-panel2)));
  box-shadow:0 0 0 1px color-mix(in srgb,var(--c-brand) 8%,transparent);
}
.jmlc-bot-menu-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
}
.jmlc-bot-menu-chips code{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:3px 8px;
  border:1px solid color-mix(in srgb,var(--c-brand) 30%,var(--c-line));
  border-radius:999px;
  background:color-mix(in srgb,var(--c-brand) 8%,var(--c-panel2));
  color:var(--c-text);
  font-family:inherit;
  font-size:11px;
  font-weight:850;
  line-height:1;
}

/* =========================================================
   v0.5.6 — desktop stage scale + menu interaction stabilization
   Mobile keyboard geometry is intentionally unchanged from v0.5.5 because
   the installed-app path is currently the approved near-perfect behavior.
   ========================================================= */
@media (min-width:761px) and (pointer:fine), (min-width:761px) and (pointer:none), (min-width:761px) and (orientation:landscape) and (min-height:501px){
  .jmlc-stage{
    /* Let the unified stage grow beyond a narrow Elementor content column
       while remaining centered and inside the browser viewport. */
    width:min(96vw,1500px)!important;
    max-width:none!important;
    margin-left:calc((100% - min(96vw,1500px))/2)!important;
    margin-right:0!important;
    height:clamp(620px,78vh,840px)!important;
  }
  .jmlc-stage-chat{
    min-width:340px!important;
  }
}

@media (min-width:761px) and (pointer:fine) and (max-height:760px), (min-width:761px) and (pointer:none) and (max-height:760px), (min-width:761px) and (orientation:landscape) and (min-height:501px) and (max-height:760px){
  .jmlc-stage{
    height:clamp(540px,82vh,660px)!important;
  }
}

@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  /* Keep the menu visible and tappable above scrolling chat content. */
  .jmlc-menu{
    width:min(300px,calc(100vw - 24px))!important;
    max-height:min(62dvh,520px)!important;
    overflow:auto!important;
    overscroll-behavior:contain!important;
  }
}

/* =========================================================
   v0.5.7 — desktop true 16:9 player / equal-height chat
   Desktop only. The unified stage row is now sized by the player's
   native 16:9 viewport instead of an arbitrary tall stage. This removes
   the large top/bottom black frame created when stream-temp.html was
   forced into a portrait-ish iframe. Chat stretches to the exact same
   height. Mobile keyboard/menu behavior is intentionally untouched.
   ========================================================= */
@media (min-width:761px) and (pointer:fine), (min-width:761px) and (pointer:none), (min-width:761px) and (orientation:landscape) and (min-height:501px){
  .jmlc-stage{
    width:min(99vw,1900px)!important;
    max-width:none!important;
    margin-left:calc((100% - min(99vw,1900px))/2)!important;
    margin-right:0!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    align-items:stretch!important;
    background:transparent!important;
    overflow:hidden!important;
  }

  .jmlc-stage-player{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    aspect-ratio:16 / 9!important;
    align-self:start!important;
    background:#000!important;
    overflow:hidden!important;
  }

  .jmlc-stage-video{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    aspect-ratio:16 / 9!important;
    background:#000!important;
  }

  .jmlc-stage-video iframe{
    width:100%!important;
    height:100%!important;
    inset:0!important;
  }

  .jmlc-stage-chat{
    height:100%!important;
    min-height:0!important;
    align-self:stretch!important;
  }

  .jmlc-stage-chat > .jmlc-shell,
  .jmlc-stage .jmlc-shell{
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
  }
}

/* =========================================================
   v0.5.8 — desktop equal-height stage correction
   The v0.5.7 row could still be sized by the chat column's intrinsic
   content, allowing chat to grow taller than the 16:9 player. Desktop
   stage height is now supplied by JS from the actual rendered player
   column width (width * 9 / 16), then both columns are hard-clamped to
   that exact height. Mobile remains untouched.
   ========================================================= */
@media (min-width:761px) and (pointer:fine), (min-width:761px) and (pointer:none), (min-width:761px) and (orientation:landscape) and (min-height:501px){
  .jmlc-stage{
    height:var(--jmlc-stage-desktop-h,620px)!important;
    min-height:0!important;
    max-height:none!important;
    align-items:stretch!important;
    overflow:hidden!important;
  }
  .jmlc-stage-player{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    aspect-ratio:auto!important;
    align-self:stretch!important;
    overflow:hidden!important;
  }
  .jmlc-stage-video{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    aspect-ratio:auto!important;
    overflow:hidden!important;
  }
  .jmlc-stage-chat{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    align-self:stretch!important;
    overflow:hidden!important;
  }
  .jmlc-stage-chat > .jmlc-shell,
  .jmlc-stage .jmlc-shell{
    height:100%!important;
    min-height:0!important;
    max-height:100%!important;
    overflow:hidden!important;
  }
  .jmlc-stage .jmlc-chat{
    min-height:0!important;
    overflow:hidden!important;
  }
  .jmlc-stage .jmlc-messages{
    min-height:0!important;
    overflow-y:auto!important;
  }
}

/* =========================================================
   v0.5.9 — desktop chat width restoration
   Bring the right-side chat closer to the roomy legacy desktop layout.
   Existing installs may still have the older 360px option saved, so this
   responsive desktop rule intentionally establishes a larger floor now.
   ========================================================= */
@media (min-width:761px) and (pointer:fine), (min-width:761px) and (pointer:none), (min-width:761px) and (orientation:landscape) and (min-height:501px){
  .jmlc-stage{
    grid-template-columns:minmax(0,1fr) clamp(460px,27vw,560px)!important;
  }
  .jmlc-stage-chat{
    min-width:460px!important;
  }
}
@media(min-width:1700px){
  .jmlc-stage{
    grid-template-columns:minmax(0,1fr) clamp(500px,28vw,600px)!important;
  }
  .jmlc-stage-chat{
    min-width:500px!important;
  }
}

/* =========================================================
   v0.6.0 — exact desktop chat width + member color controls
   Desktop chat is intentionally fixed at 460px per approved LIVE layout.
   ========================================================= */
@media (min-width:761px) and (pointer:fine), (min-width:761px) and (pointer:none), (min-width:761px) and (orientation:landscape) and (min-height:501px){
  .jmlc-stage{
    grid-template-columns:minmax(0,1fr) var(--jmlc-stage-chat-width,460px)!important;
  }
  .jmlc-stage-chat{
    width:var(--jmlc-stage-chat-width,460px)!important;
    min-width:var(--jmlc-stage-chat-width,460px)!important;
    max-width:var(--jmlc-stage-chat-width,460px)!important;
  }
}

.jmlc-color-menu{
  border-top:1px solid var(--c-line);
  border-bottom:1px solid var(--c-line);
  margin:3px 0;
}
.jmlc-color-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:7px 0;
  color:var(--c-text);
  font-size:12px;
  font-weight:700;
}
.jmlc-color-row input[type="color"]{
  width:42px;
  height:30px;
  padding:2px;
  border:1px solid var(--c-line);
  border-radius:8px;
  background:var(--c-panel3);
  cursor:pointer;
}
.jmlc-color-preview{
  display:grid;
  gap:6px;
  margin:10px 0 8px;
  padding:8px;
  border:1px solid var(--c-line);
  border-radius:10px;
  background:var(--c-panel);
}
.jmlc-color-preview strong{
  font-size:12px;
  line-height:1.2;
}
.jmlc-color-preview span{
  display:inline-block;
  justify-self:start;
  max-width:100%;
  padding:6px 9px;
  border:1px solid transparent;
  border-radius:4px 11px 11px 11px;
  font-size:12px;
  line-height:1.35;
}
.jmlc-color-actions{
  display:flex;
  gap:7px;
}
.jmlc-color-save,
.jmlc-color-reset{
  min-height:31px;
  border:1px solid var(--c-line);
  border-radius:8px;
  padding:6px 9px;
  background:var(--c-panel3);
  color:var(--c-text);
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}
.jmlc-color-save{
  background:color-mix(in srgb,var(--c-brand) 18%,var(--c-panel3));
  border-color:color-mix(in srgb,var(--c-brand) 48%,var(--c-line));
}
.jmlc-color-save:disabled{
  opacity:.55;
  cursor:wait;
}
.jmlc-color-status{
  min-height:15px;
  margin:6px 1px 0;
  color:var(--c-muted);
  font-size:10px;
}
.jmlc-bubble.jmlc-user-colored a,
.jmlc-bubble.jmlc-user-colored a:hover{
  color:inherit!important;
  text-decoration:underline!important;
  text-underline-offset:2px;
}


/* =========================================================
   v0.6.3 — desktop stage 30% reduction
   Desktop JS now scales the v0.6.2 viewport-fit height to 70%, keeping the
   player true 16:9 and the chat exactly equal in height. The chat remains
   460px wide. Mobile/PWA keyboard geometry remains untouched.
   ========================================================= */
@media (min-width:761px) and (pointer:fine), (min-width:761px) and (pointer:none), (min-width:761px) and (orientation:landscape) and (min-height:501px){
  .jmlc-stage{
    width:var(--jmlc-stage-desktop-w,calc(100vw - 16px))!important;
    max-width:none!important;
    margin-left:calc((100% - var(--jmlc-stage-desktop-w,calc(100vw - 16px)))/2)!important;
    margin-right:0!important;
    height:var(--jmlc-stage-desktop-h,620px)!important;
    min-height:0!important;
    max-height:none!important;
  }
  .jmlc-stage-player,
  .jmlc-stage-video,
  .jmlc-stage-video iframe{
    min-height:0!important;
    max-height:100%!important;
  }
}


.jmlc-msg-more{display:none!important;}

/* v0.7.8 — desktop regression guard: the compact three-dot message trigger is
   strictly a mobile affordance. CommunityHub/WordPress global button rules must
   never resurrect it on desktop. The max-width:760px block below explicitly
   enables it again for mobile. */
@media (min-width:761px) and (pointer:fine), (min-width:761px) and (pointer:none), (min-width:761px) and (orientation:landscape) and (min-height:501px){
  .jmlc-msg-more{display:none!important;visibility:hidden!important;pointer-events:none!important;}
}

/* =========================================================
   v0.7.2 — MOBILE STABILITY + DENSITY FOUNDATION
   Desktop v0.6.3 geometry is intentionally untouched.

   Design reference: the old Minnit mobile experience kept the conversation
   in a bounded app viewport, reserved a dedicated composer area, grouped
   message runs, and exposed extra composer controls contextually. This block
   gives JeffMAC LIVE Chat the same interaction principles without copying
   Minnit's styling or depending on their service.
   ========================================================= */
@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  /* Compact app chrome: more conversation, less frame. */
  .jmlc-header{
    flex:0 0 46px!important;
    min-height:46px!important;
    padding:0 8px!important;
    gap:7px!important;
  }
  .jmlc-header-left,.jmlc-header-right{gap:6px!important}
  .jmlc-header-left strong{font-size:13px!important}
  .jmlc-online-btn{min-height:30px!important;padding:4px 8px!important}
  .jmlc-menu-btn{width:31px!important;height:31px!important}

  .jmlc-chat{
    min-height:0!important;
    overflow:hidden!important;
  }
  .jmlc-messages{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    padding:7px 6px 9px!important;
    scroll-behavior:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch;
    overflow-anchor:auto;
  }

  /* Dense message rhythm inspired by the old mobile chat. */
  .jmlc-msg{
    grid-template-columns:31px minmax(0,1fr)!important;
    column-gap:7px!important;
    padding:4px 5px!important;
    border-radius:8px!important;
  }
  .jmlc-msg:hover{background:transparent!important}
  .jmlc-avatar-wrap{
    width:30px!important;height:30px!important;
    min-width:30px!important;min-height:30px!important;
  }
  .jmlc-meta{
    min-height:15px!important;
    gap:5px!important;
    margin:0 28px 2px 0!important;
    line-height:1.1!important;
  }
  .jmlc-name{font-size:12px!important;line-height:1.1!important}
  .jmlc-time,.jmlc-edited{font-size:8.5px!important}
  .jmlc-badge,.jmlc-bot-badge{font-size:7.5px!important;min-height:15px!important;padding:1px 5px!important}
  .jmlc-bubble{
    max-width:100%!important;
    padding:5px 8px!important;
    border-radius:4px 10px 10px 10px!important;
    font-size:var(--jmlc-message-font,13px)!important;
    line-height:1.35!important;
  }
  .jmlc-reply-preview{
    max-width:100%!important;
    margin-bottom:3px!important;
    padding:4px 7px!important;
    font-size:10px!important;
    line-height:1.25!important;
  }
  .jmlc-reactions{gap:3px!important;margin-top:3px!important}
  .jmlc-reaction{
    height:21px!important;min-height:21px!important;max-height:21px!important;
    padding:0 6px!important;font-size:12px!important;
  }
  .jmlc-reaction img{width:14px!important;height:14px!important;max-width:14px!important;max-height:14px!important}
  .jmlc-media{max-width:min(100%,280px)!important;max-height:230px!important;margin-top:4px!important;border-radius:8px!important}

  /* Consecutive messages from the same sender become a visual run. Keep the
     avatar column for alignment but do not repeat identity chrome. */
  .jmlc-msg-grouped{padding-top:1px!important;padding-bottom:2px!important}
  .jmlc-msg-grouped .jmlc-avatar-wrap{visibility:hidden!important}
  .jmlc-msg-grouped .jmlc-meta{display:none!important}
  .jmlc-msg-grouped .jmlc-bubble{border-radius:7px 10px 10px 7px!important}

  /* Bot participates in the same compact stream instead of dominating it. */
  .jmlc-bot-message .jmlc-bubble{
    line-height:1.35!important;
    box-shadow:inset 2px 0 0 color-mix(in srgb,var(--c-brand) 70%,transparent)!important;
  }
  .jmlc-bot-avatar-mark{font-size:12px!important}
  .jmlc-bot-avatar-bolt{width:12px!important;height:12px!important;font-size:7px!important;right:-3px!important;bottom:-2px!important}

  /* Mobile actions: one tiny affordance. The full action strip only appears
     when requested, instead of consuming a row under every message. */
  .jmlc-msg-more{
    all:unset!important;
    box-sizing:border-box!important;
    position:absolute!important;
    right:4px!important;
    top:3px!important;
    z-index:4!important;
    display:grid!important;
    place-items:center!important;
    width:28px!important;
    height:24px!important;
    border-radius:7px!important;
    color:var(--c-faint)!important;
    font-size:15px!important;
    line-height:1!important;
    cursor:pointer!important;
    touch-action:manipulation!important;
  }
  .jmlc-msg-more:active,
  .jmlc-actions-open .jmlc-msg-more{
    background:var(--c-panel3)!important;
    color:var(--c-text)!important;
  }
  .jmlc-msg-actions{
    position:absolute!important;
    right:5px!important;
    top:29px!important;
    z-index:12!important;
    display:flex!important;
    gap:2px!important;
    margin:0!important;
    padding:3px!important;
    opacity:0!important;
    pointer-events:none!important;
    transform:translateY(-3px)!important;
    box-shadow:0 8px 22px rgba(0,0,0,.30)!important;
  }
  .jmlc-actions-open .jmlc-msg-actions{
    opacity:1!important;
    pointer-events:auto!important;
    transform:none!important;
  }
  .jmlc-msg-actions button{
    width:31px!important;height:29px!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
  }
  .jmlc-menu-btn{
    pointer-events:auto!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
  }

  /* One compact composer row. Like Minnit, nonessential tools collapse while
     typing so the text field gets the width and Send remains obvious. */
  .jmlc-composer{
    flex:0 0 auto!important;
    display:flex!important;
    align-items:flex-end!important;
    gap:4px!important;
    width:100%!important;
    padding:6px 6px calc(6px + env(safe-area-inset-bottom,0px))!important;
    margin:0!important;
    border-top:1px solid var(--c-line)!important;
    background:var(--c-panel)!important;
    position:relative!important;
    inset:auto!important;
    transform:none!important;
  }
  .jmlc-tool-row{
    display:flex!important;
    flex:0 0 auto!important;
    align-items:center!important;
    gap:1px!important;
    grid-column:auto!important;
  }
  .jmlc-tool{
    width:31px!important;
    min-width:31px!important;
    height:38px!important;
    padding:0!important;
    border-radius:8px!important;
    font-size:16px!important;
  }
  .jmlc-tool-text{font-size:10px!important}
  .jmlc-composer textarea{
    flex:1 1 auto!important;
    width:auto!important;
    min-width:0!important;
    min-height:38px!important;
    max-height:88px!important;
    padding:8px 10px!important;
    border-radius:19px!important;
    line-height:1.3!important;
    font-size:16px!important; /* prevents iOS focus zoom */
  }
  .jmlc-send{
    flex:0 0 38px!important;
    width:38px!important;
    height:38px!important;
    border-radius:11px!important;
    box-shadow:none!important;
  }
  .jmlc-composer.is-typing .jmlc-tool-row [data-jmlc-gif],
  .jmlc-composer.is-typing .jmlc-tool-row [data-jmlc-upload]{
    display:none!important;
  }
  .jmlc-composer.is-typing .jmlc-send{
    box-shadow:0 4px 12px color-mix(in srgb,var(--c-brand) 24%,transparent)!important;
  }
  .jmlc-reply-bar{
    padding:5px 8px!important;
    font-size:10px!important;
  }
  .jmlc-attachment-preview{padding:5px 8px!important}
  .jmlc-jump-live{
    right:8px!important;
    bottom:calc(var(--jmlc-bottom-ui,54px) + 7px)!important;
    padding:6px 9px!important;
    font-size:11px!important;
  }

  /* Menus/pickers remain functional but do not become permanent layout rows. */
  .jmlc-menu{width:min(300px,calc(100vw - 16px))!important;max-height:min(66dvh,520px)!important}
  .jmlc-picker.jmlc-viewport-picker{max-width:calc(100vw - 14px)!important}
}

/* =========================================================
   v0.8.0 — MOBILE + TABLET-PORTRAIT FIT-TO-SCREEN LIVE STAGE
   One authority for mobile stage geometry (older mobile geometry blocks
   were removed). Desktop and tablet-landscape use the desktop rules above.

   Normal:  the stage exactly fills the visible screen (JS measures it,
            minus the CommunityHub bottom bar when it is showing).
            Player on top at true 16:9, chat fills the rest, composer at
            the bottom edge of the screen.
   Typing:  the stage is pinned to the visible area above the keyboard.
            Player stays on top, chat shrinks, composer sits on the keyboard.
   Phone landscape: player left, chat right, like Twitch.
   ========================================================= */
@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  /* Keep the theme header in normal page flow on LIVE Stage pages so it
     scrolls away above the stage instead of covering the player. */
  html.jmlc-live-stage-page body.ch-theme > .ch-theme-header,
  html.jmlc-live-stage-page body.ch-theme > .elementor-location-header,
  html.jmlc-live-stage-page .ch-theme-header,
  html.jmlc-live-stage-page .elementor-location-header{
    position:relative!important;
    top:auto!important;
    bottom:auto!important;
    transform:none!important;
    opacity:1!important;
  }

  html.jmlc-live-stage-page .jmlc-stage{
    display:flex!important;
    flex-direction:column!important;
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    max-width:none!important;
    height:var(--jmlc-fit-h,100svh)!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    transform:none!important;
    background:#000!important;
    grid-template-columns:none!important;
  }

  /* Player: full width, true 16:9, never more than 45% of the stage. */
  html.jmlc-live-stage-page .jmlc-stage .jmlc-stage-player{
    flex:0 0 auto!important;
    width:100%!important;
    height:auto!important;
    aspect-ratio:16 / 9!important;
    min-height:0!important;
    max-height:45%!important;
    align-self:stretch!important;
    overflow:hidden!important;
    background:#000!important;
  }
  html.jmlc-live-stage-page .jmlc-stage .jmlc-stage-video{
    position:relative!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    background:#000!important;
  }
  html.jmlc-live-stage-page .jmlc-stage .jmlc-stage-video iframe{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    max-height:none!important;
  }

  /* Chat: everything under the player. */
  html.jmlc-live-stage-page .jmlc-stage .jmlc-stage-chat{
    position:relative!important;
    inset:auto!important;
    flex:1 1 0!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    overflow:hidden!important;
    transform:none!important;
    background:var(--ch-theme-bg,#07101f)!important;
  }
  html.jmlc-live-stage-page .jmlc-stage .jmlc-stage-chat > .jmlc-shell{
    flex:1 1 auto!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
    overflow:hidden!important;
    border-radius:0!important;
    border-left:0!important;
    border-right:0!important;
    border-bottom:0!important;
    box-shadow:none!important;
  }
  html.jmlc-live-stage-page .jmlc-stage .jmlc-chat{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  html.jmlc-live-stage-page .jmlc-stage .jmlc-messages{
    min-height:0!important;
    overscroll-behavior:contain!important;
  }
  html.jmlc-live-stage-page .jmlc-stage .jmlc-composer{
    flex:0 0 auto!important;
    position:relative!important;
    inset:auto!important;
    margin:0!important;
    transform:none!important;
    scroll-margin:0!important;
  }

  /* Keeps the page the same height while the stage is pinned for typing,
     so nothing below or above it jumps. */
  .jmlc-stage-spacer{display:block;width:100%;height:0;margin:0;padding:0;pointer-events:none}

  /* Typing: pin the stage to the visible area above the keyboard. */
  html.jmlc-live-stage-page .jmlc-stage.jmlc-stage-keyboard{
    position:fixed!important;
    left:var(--jmlc-kb-left,0px)!important;
    top:var(--jmlc-kb-top,0px)!important;
    right:auto!important;
    bottom:auto!important;
    width:var(--jmlc-kb-width,100vw)!important;
    height:var(--jmlc-kb-height,100svh)!important;
    z-index:2147482999!important;
  }
  html.jmlc-live-stage-page .jmlc-stage.jmlc-stage-keyboard .jmlc-composer{
    padding-bottom:6px!important;
  }
  html.jmlc-stage-keyboard-active .ch-theme-community-bar--bottom,
  html.jmlc-stage-keyboard-active [class*="community-bar--bottom"]{
    visibility:hidden!important;
  }
  html.jmlc-stage-keyboard-active,
  html.jmlc-stage-keyboard-active body{
    overscroll-behavior-y:none!important;
    scroll-behavior:auto!important;
  }
}

/* Phone landscape: player left, chat right. */
@media (pointer:coarse) and (orientation:landscape) and (max-height:500px), (max-width:760px) and (orientation:landscape) and (max-height:500px){
  html.jmlc-live-stage-page .jmlc-stage{
    flex-direction:row!important;
  }
  html.jmlc-live-stage-page .jmlc-stage .jmlc-stage-player{
    flex:1 1 auto!important;
    width:auto!important;
    height:100%!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    min-width:0!important;
  }
  html.jmlc-live-stage-page .jmlc-stage .jmlc-stage-chat{
    flex:0 0 clamp(260px,40%,400px)!important;
    width:auto!important;
    height:100%!important;
  }
  html.jmlc-live-stage-page .jmlc-stage .jmlc-stage-chat > .jmlc-shell{
    border-top:0!important;
    border-left:1px solid var(--c-line)!important;
  }
  /* Keyboard leaves very little height in landscape; give it to messages. */
  html.jmlc-live-stage-page .jmlc-stage.jmlc-stage-keyboard .jmlc-header{
    display:none!important;
  }
}

/* =========================================================
   v0.8.1 — mobile ••• message menu fix
   An old v0.3.20 rule forced the action buttons to show under every
   comment while a newer rule made them untappable until ••• was pressed,
   so the ••• looked dead. Now: hidden until ••• is tapped, then a small
   popup under the ••• that works. Desktop is untouched.
   ========================================================= */
@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  .jmlc-shell .jmlc-msg .jmlc-content-stack .jmlc-msg-actions{
    position:absolute!important;
    right:4px!important;
    top:29px!important;
    left:auto!important;
    bottom:auto!important;
    z-index:12!important;
    display:flex!important;
    align-self:auto!important;
    width:max-content!important;
    max-width:calc(100% - 8px)!important;
    margin:0!important;
    padding:3px!important;
    gap:2px!important;
    border:1px solid var(--c-line)!important;
    border-radius:10px!important;
    background:var(--c-panel2)!important;
    box-shadow:0 8px 22px rgba(0,0,0,.30)!important;
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
    transform:translateY(-3px)!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transform:none!important;
  }
  .jmlc-shell.jmlc-menu-open .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions{
    display:none!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open{
    z-index:13!important;
  }
}

/* v0.8.2 — tap a comment to open its menu: highlight the open comment and
   remove the blue tap flash. Mobile only. */
@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  .jmlc-shell .jmlc-msg{
    -webkit-tap-highlight-color:transparent!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open{
    background:var(--c-panel2)!important;
  }
}

/* =========================================================
   v0.8.5 — desktop half-screen: taller chat
   Only active when JS adds .jmlc-stage-tall-chat (window width is the
   limit). Player keeps its 16:9 size at the top; the chat runs down to the
   bottom of the window. Full-screen desktop never gets this class.
   ========================================================= */
@media (min-width:761px) and (pointer:fine), (min-width:761px) and (pointer:none), (min-width:761px) and (orientation:landscape) and (min-height:501px){
  .jmlc-stage.jmlc-stage-tall-chat{
    height:var(--jmlc-stage-desktop-chat-h,var(--jmlc-stage-desktop-h,620px))!important;
    align-items:start!important;
    background:transparent!important;
  }
  .jmlc-stage.jmlc-stage-tall-chat .jmlc-stage-player{
    height:var(--jmlc-stage-desktop-h,620px)!important;
    max-height:none!important;
    align-self:start!important;
    background:#000!important;
  }
  .jmlc-stage.jmlc-stage-tall-chat .jmlc-stage-chat{
    height:100%!important;
    max-height:100%!important;
    align-self:stretch!important;
  }
}


/* =========================================================
   v0.8.8 — reaction viewer + viewer-friendly pinned comments
   ========================================================= */
.jmlc-msg-actions button[hidden]{display:none!important}
.jmlc-msg-actions .jmlc-action-wide{
  width:auto!important;
  min-width:max-content!important;
  padding-left:8px!important;
  padding-right:8px!important;
  gap:4px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  white-space:nowrap!important;
}
.jmlc-msg-actions .jmlc-action-wide span{font-size:10px!important;font-weight:800!important}

.jmlc-pin-zone{
  flex:0 0 auto!important;
  padding:6px 8px 0!important;
  background:var(--c-panel)!important;
  position:relative!important;
  z-index:30!important;
}
.jmlc-pinned-card{
  display:flex!important;
  align-items:flex-start!important;
  gap:8px!important;
  padding:8px 9px!important;
  border:1px solid color-mix(in srgb,var(--c-brand) 55%,var(--c-line))!important;
  border-radius:10px!important;
  background:color-mix(in srgb,var(--c-brand) 8%,var(--c-panel))!important;
  color:var(--c-text)!important;
  box-shadow:0 5px 16px rgba(0,0,0,.12)!important;
}
.jmlc-pinned-icon{flex:0 0 auto;font-size:16px;line-height:1.4}
.jmlc-pinned-copy{flex:1;min-width:0}
.jmlc-pinned-kicker{font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.07em;color:var(--c-brand)}
.jmlc-pinned-copy strong{display:block;font-size:11px;line-height:1.25;color:var(--c-text)}
.jmlc-pinned-text{margin-top:2px;font-size:11px;line-height:1.3;color:var(--c-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jmlc-pinned-actions{display:flex;align-items:center;gap:4px;flex:0 0 auto}
.jmlc-pinned-actions button,.jmlc-pin-marker{
  border:1px solid var(--c-line)!important;
  border-radius:7px!important;
  background:var(--c-panel2)!important;
  color:var(--c-text)!important;
  font-size:10px!important;
  font-weight:800!important;
  min-height:27px!important;
  padding:4px 7px!important;
  cursor:pointer!important;
}
.jmlc-pinned-actions button:hover,.jmlc-pin-marker:hover{border-color:var(--c-brand)!important;background:var(--c-panel3)!important}
.jmlc-pin-marker{
  position:absolute!important;
  top:48px!important;
  right:8px!important;
  z-index:35!important;
  width:31px!important;
  height:31px!important;
  padding:0!important;
  font-size:15px!important;
  box-shadow:0 5px 15px rgba(0,0,0,.2)!important;
}

.jmlc-reaction-dialog{
  position:absolute!important;
  inset:0!important;
  z-index:2100!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:14px!important;
  background:rgba(0,0,0,.58)!important;
  backdrop-filter:blur(3px);
}
.jmlc-reaction-dialog[hidden]{display:none!important}
.jmlc-reaction-dialog-card{
  width:min(390px,100%)!important;
  max-height:min(520px,82%)!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border:1px solid var(--c-line)!important;
  border-radius:14px!important;
  background:var(--c-panel)!important;
  color:var(--c-text)!important;
  box-shadow:0 22px 70px rgba(0,0,0,.45)!important;
}
.jmlc-reaction-dialog-card>header{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:12px 13px!important;
  border-bottom:1px solid var(--c-line)!important;
}
.jmlc-reaction-dialog-kicker{display:block;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--c-brand)}
.jmlc-reaction-dialog-card h3{margin:1px 0 0!important;font-size:15px!important;color:var(--c-text)!important}
.jmlc-reaction-dialog-card>header button{
  width:30px!important;height:30px!important;border:1px solid var(--c-line)!important;border-radius:8px!important;background:var(--c-panel2)!important;color:var(--c-text)!important;cursor:pointer!important
}
.jmlc-reaction-dialog-body{padding:8px!important;overflow:auto!important;min-height:90px!important}
.jmlc-reaction-person{display:grid!important;grid-template-columns:34px minmax(0,1fr) auto!important;align-items:center!important;gap:8px!important;padding:7px!important;border-radius:9px!important}
.jmlc-reaction-person:hover{background:var(--c-panel2)!important}
.jmlc-reaction-person-avatar,.jmlc-reaction-person-avatar img,.jmlc-reaction-person-fallback{width:34px!important;height:34px!important;border-radius:50%!important}
.jmlc-reaction-person-avatar{display:block!important}
.jmlc-reaction-person-avatar img{display:block!important;object-fit:cover!important}
.jmlc-reaction-person-fallback{display:flex!important;align-items:center!important;justify-content:center!important;background:var(--c-panel3)!important;color:var(--c-text)!important;font-weight:900!important}
.jmlc-reaction-person strong{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;font-size:12px!important}
.jmlc-reaction-person-emojis{display:flex!important;align-items:center!important;gap:4px!important;font-size:18px!important}
.jmlc-reaction-person-emojis img{width:22px!important;height:22px!important;object-fit:contain!important}
.jmlc-reaction-dialog-empty{padding:22px 10px!important;text-align:center!important;color:var(--c-muted)!important;font-size:12px!important;line-height:1.45!important}

@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  .jmlc-shell .jmlc-msg .jmlc-content-stack .jmlc-msg-actions{flex-wrap:wrap!important;justify-content:flex-end!important}
  .jmlc-shell .jmlc-msg .jmlc-content-stack .jmlc-msg-actions .jmlc-action-wide{height:29px!important}
  .jmlc-pinned-card{padding:7px!important;gap:6px!important}
  .jmlc-pinned-actions button{padding:3px 5px!important;font-size:9px!important}
  .jmlc-pinned-text{max-width:42vw!important}
  .jmlc-pin-marker{top:44px!important;right:6px!important}
}

/* v0.8.9 — up to 18 reactions, always six per row */
.jmlc-picker.is-reaction .jmlc-picker-grid{grid-template-columns:repeat(6,minmax(36px,1fr))!important;max-width:330px;margin:0 auto}

/* v0.8.10 — member identity interactions */
.jmlc-avatar-wrap[data-profile-user-id],
.jmlc-name[data-mention-user-id]{cursor:pointer}
.jmlc-name[data-mention-user-id]:hover{text-decoration:underline;text-underline-offset:2px}
.jmlc-avatar-wrap[data-profile-user-id]:focus-visible,
.jmlc-name[data-mention-user-id]:focus-visible{outline:2px solid var(--c-brand);outline-offset:2px;border-radius:6px}


/* =========================================================
   v0.8.12 — LIVE polls
   ========================================================= */
.jmlc-start-poll-btn{width:100%!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;margin:0 0 5px!important;padding:8px 10px!important;border:1px solid color-mix(in srgb,var(--c-brand) 60%,var(--c-line))!important;border-radius:8px!important;background:color-mix(in srgb,var(--c-brand) 10%,var(--c-panel2))!important;color:var(--c-text)!important;font-weight:800!important;cursor:pointer!important}
.jmlc-poll-zone{flex:0 0 auto!important;padding:6px 8px 0!important;background:var(--c-panel)!important;position:relative!important;z-index:29!important}
.jmlc-poll-card{border:1px solid color-mix(in srgb,var(--c-brand) 50%,var(--c-line))!important;border-radius:11px!important;background:var(--c-panel2)!important;padding:9px!important;color:var(--c-text)!important;box-shadow:0 4px 15px rgba(0,0,0,.10)!important}
.jmlc-poll-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:8px!important;margin-bottom:7px!important}
.jmlc-poll-head>div{min-width:0!important}.jmlc-poll-kicker{display:block!important;font-size:9px!important;font-weight:900!important;letter-spacing:.07em!important;color:var(--c-brand)!important}.jmlc-poll-head strong{display:block!important;margin-top:1px!important;font-size:12px!important;line-height:1.3!important;color:var(--c-text)!important}.jmlc-poll-status{flex:0 0 auto!important;border:1px solid var(--c-line)!important;border-radius:999px!important;padding:2px 6px!important;font-size:9px!important;font-weight:800!important;color:var(--c-muted)!important}
.jmlc-poll-options{display:grid!important;gap:5px!important}.jmlc-poll-option{position:relative!important;overflow:hidden!important;width:100%!important;text-align:left!important;border:1px solid var(--c-line)!important;border-radius:8px!important;background:var(--c-panel)!important;color:var(--c-text)!important;padding:6px 7px!important;cursor:pointer!important}.jmlc-poll-option:hover{border-color:var(--c-brand)!important}.jmlc-poll-option.is-selected{border-color:var(--c-brand)!important;box-shadow:0 0 0 1px color-mix(in srgb,var(--c-brand) 40%,transparent)!important}.jmlc-poll-option:disabled{cursor:default!important;opacity:.9!important}.jmlc-poll-option-main{position:relative!important;z-index:2!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;font-size:10px!important}.jmlc-poll-option-main strong{font-size:11px!important}.jmlc-poll-option-main span{color:var(--c-muted)!important;white-space:nowrap!important}.jmlc-poll-meter{display:block!important;height:3px!important;margin-top:4px!important;border-radius:99px!important;background:var(--c-line)!important;overflow:hidden!important}.jmlc-poll-meter i{display:block!important;height:100%!important;background:var(--c-brand)!important;border-radius:99px!important;transition:width .2s ease!important}
.jmlc-poll-footer{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;margin-top:6px!important;font-size:9px!important;color:var(--c-muted)!important}.jmlc-poll-admin-actions{display:flex!important;gap:4px!important}.jmlc-poll-admin-actions button{border:1px solid var(--c-line)!important;border-radius:6px!important;background:var(--c-panel)!important;color:var(--c-text)!important;font-size:9px!important;font-weight:800!important;padding:3px 6px!important;cursor:pointer!important}
.jmlc-poll-dialog{position:absolute!important;inset:0!important;z-index:2200!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:14px!important;background:rgba(0,0,0,.62)!important;backdrop-filter:blur(3px)!important}.jmlc-poll-dialog[hidden]{display:none!important}.jmlc-poll-dialog-card{width:min(420px,100%)!important;max-height:min(620px,90%)!important;overflow:auto!important;border:1px solid var(--c-line)!important;border-radius:14px!important;background:var(--c-panel)!important;color:var(--c-text)!important;box-shadow:0 22px 70px rgba(0,0,0,.45)!important}.jmlc-poll-dialog-card>header{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:12px 13px!important;border-bottom:1px solid var(--c-line)!important}.jmlc-poll-dialog-card h3{margin:1px 0 0!important;font-size:15px!important;color:var(--c-text)!important}.jmlc-poll-dialog-card>header button{width:30px!important;height:30px!important;border:1px solid var(--c-line)!important;border-radius:8px!important;background:var(--c-panel2)!important;color:var(--c-text)!important;cursor:pointer!important}.jmlc-poll-dialog-body{padding:12px!important;display:grid!important;gap:9px!important}.jmlc-poll-dialog-body label{display:grid!important;gap:4px!important;font-size:10px!important;font-weight:800!important;color:var(--c-muted)!important}.jmlc-poll-dialog-body small{font-weight:500!important}.jmlc-poll-dialog-body input,.jmlc-poll-dialog-body select{width:100%!important;border:1px solid var(--c-line)!important;border-radius:8px!important;background:var(--c-panel2)!important;color:var(--c-text)!important;padding:8px!important;font-size:12px!important}.jmlc-poll-choice-inputs{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important}.jmlc-poll-create{border:1px solid var(--c-brand)!important;border-radius:8px!important;background:var(--c-brand)!important;color:#fff!important;padding:9px 11px!important;font-weight:900!important;cursor:pointer!important}
@media(max-width:520px){.jmlc-poll-choice-inputs{grid-template-columns:1fr!important}.jmlc-poll-zone{padding:5px 6px 0!important}.jmlc-poll-card{padding:7px!important}.jmlc-poll-option{padding:5px 6px!important}}


/* v0.8.14 — viewer-collapsible LIVE polls */
.jmlc-poll-footer-actions{display:flex!important;align-items:center!important;gap:4px!important;flex-wrap:wrap!important;justify-content:flex-end!important}
.jmlc-poll-hide{border:1px solid var(--c-line)!important;border-radius:6px!important;background:var(--c-panel)!important;color:var(--c-text)!important;font-size:9px!important;font-weight:800!important;padding:3px 6px!important;cursor:pointer!important}
.jmlc-poll-hide:hover{border-color:var(--c-brand)!important}
.jmlc-poll-marker{flex:0 0 auto!important;align-self:flex-start!important;margin:5px 8px 0!important;border:1px solid color-mix(in srgb,var(--c-brand) 55%,var(--c-line))!important;border-radius:999px!important;background:var(--c-panel2)!important;color:var(--c-text)!important;padding:4px 8px!important;font-size:10px!important;font-weight:900!important;line-height:1!important;cursor:pointer!important;position:relative!important;z-index:29!important;box-shadow:0 3px 10px rgba(0,0,0,.10)!important}
.jmlc-poll-marker:hover{border-color:var(--c-brand)!important}
.jmlc-poll-marker[hidden]{display:none!important}
@media(max-width:520px){.jmlc-poll-marker{margin:4px 6px 0!important;padding:4px 7px!important}}


/* v0.8.16 — interaction feedback: own reactions, mentions, cloned pins, poll results */
.jmlc-reaction.is-mine{
  border-color:var(--c-brand)!important;
  background:color-mix(in srgb,var(--c-brand) 22%,var(--c-panel2))!important;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--c-brand) 55%,transparent),0 0 12px color-mix(in srgb,var(--c-brand) 20%,transparent)!important;
  color:var(--c-text)!important;
}
.jmlc-reaction.is-mine>span{color:var(--c-text)!important;font-weight:900!important}
.jmlc-mention{display:inline!important;border-radius:4px!important;padding:0 2px!important;color:var(--c-brand)!important;font-weight:850!important;background:color-mix(in srgb,var(--c-brand) 9%,transparent)!important}
.jmlc-mention.is-me{background:color-mix(in srgb,var(--c-brand) 24%,transparent)!important;box-shadow:0 0 0 1px color-mix(in srgb,var(--c-brand) 38%,transparent)!important}
.jmlc-msg.jmlc-mentioned-me .jmlc-bubble{box-shadow:inset 3px 0 0 var(--c-brand)!important}

.jmlc-pinned-card{display:grid!important;gap:6px!important;padding:7px 8px!important}
.jmlc-pinned-topline{display:flex!important;align-items:center!important;gap:5px!important}
.jmlc-pinned-message{display:grid!important;grid-template-columns:28px minmax(0,1fr)!important;gap:7px!important;align-items:start!important}
.jmlc-pinned-avatar,.jmlc-pinned-avatar img,.jmlc-pinned-avatar span{width:28px!important;height:28px!important;border-radius:50%!important}
.jmlc-pinned-avatar{display:block!important;overflow:hidden!important;background:var(--c-panel3)!important}
.jmlc-pinned-avatar img{display:block!important;object-fit:cover!important}
.jmlc-pinned-avatar span{display:flex!important;align-items:center!important;justify-content:center!important;font-size:11px!important;font-weight:900!important;color:var(--c-text)!important}
.jmlc-pinned-copy{min-width:0!important}
.jmlc-pinned-meta{display:flex!important;align-items:center!important;gap:6px!important;min-width:0!important}
.jmlc-pinned-meta strong{font-size:11px!important;color:var(--c-text)!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
.jmlc-pinned-meta span{font-size:9px!important;color:var(--c-muted)!important;white-space:nowrap!important}
.jmlc-pinned-text{margin-top:2px!important;font-size:11px!important;line-height:1.35!important;color:var(--c-text)!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;max-width:none!important}
.jmlc-pinned-media{margin-top:5px!important;max-width:250px!important}
.jmlc-pinned-media img,.jmlc-pinned-media video{display:block!important;max-width:100%!important;max-height:120px!important;border-radius:8px!important;object-fit:cover!important;background:#000!important}
.jmlc-pinned-actions{justify-content:flex-end!important}

.jmlc-poll-option.is-winner{border-color:#f2b84b!important;box-shadow:0 0 0 1px rgba(242,184,75,.4),0 0 16px rgba(242,184,75,.16)!important;animation:jmlcWinnerPulse 1.2s ease-in-out 2!important}
.jmlc-poll-option-main em{font-style:normal!important;margin-left:4px!important;font-size:8px!important;color:var(--c-brand)!important;font-weight:900!important;text-transform:uppercase!important}
@keyframes jmlcWinnerPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.012)}}
.jmlc-poll-result{position:absolute!important;inset:0!important;z-index:2300!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:14px!important;background:rgba(0,0,0,.50)!important;backdrop-filter:blur(3px)!important}
.jmlc-poll-result[hidden]{display:none!important}
.jmlc-poll-result-card{position:relative!important;width:min(390px,100%)!important;border:1px solid color-mix(in srgb,#f2b84b 60%,var(--c-line))!important;border-radius:16px!important;background:var(--c-panel)!important;color:var(--c-text)!important;padding:18px 16px 14px!important;box-shadow:0 24px 80px rgba(0,0,0,.48)!important;text-align:center!important;transform:scale(.82) translateY(12px)!important;opacity:0!important}
.jmlc-poll-result.is-showing .jmlc-poll-result-card{animation:jmlcPollResultPop .55s cubic-bezier(.2,.9,.2,1.25) forwards!important}
@keyframes jmlcPollResultPop{to{transform:scale(1) translateY(0);opacity:1}}
.jmlc-poll-result-close{position:absolute!important;right:8px!important;top:8px!important;width:28px!important;height:28px!important;border:1px solid var(--c-line)!important;border-radius:8px!important;background:var(--c-panel2)!important;color:var(--c-text)!important;cursor:pointer!important}
.jmlc-poll-result-burst{font-size:34px!important;line-height:1!important;animation:jmlcTrophyBounce .7s ease-out .2s both!important}
@keyframes jmlcTrophyBounce{0%{transform:scale(.4) rotate(-12deg)}65%{transform:scale(1.18) rotate(5deg)}100%{transform:scale(1) rotate(0)}}
.jmlc-poll-result-kicker{display:block!important;margin-top:5px!important;color:#f2b84b!important;font-size:9px!important;font-weight:950!important;letter-spacing:.09em!important}
.jmlc-poll-result-card h3{margin:4px 24px 3px!important;font-size:17px!important;line-height:1.25!important;color:var(--c-text)!important}
.jmlc-poll-result-card p{margin:0 0 10px!important;font-size:11px!important;color:var(--c-muted)!important;line-height:1.4!important}
.jmlc-poll-result-scores{display:grid!important;gap:6px!important;text-align:left!important}
.jmlc-poll-result-row{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:4px 8px!important;align-items:center!important;font-size:10px!important;color:var(--c-text)!important}
.jmlc-poll-result-row>span{overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}.jmlc-poll-result-row>strong{font-size:9px!important;color:var(--c-muted)!important}
.jmlc-poll-result-row>i{grid-column:1/-1!important;display:block!important;height:4px!important;border-radius:99px!important;background:var(--c-line)!important;overflow:hidden!important}.jmlc-poll-result-row>i>b{display:block!important;height:100%!important;border-radius:99px!important;background:var(--c-brand)!important;animation:jmlcResultBar .7s ease-out both!important}
.jmlc-poll-result-row.is-winner>span,.jmlc-poll-result-row.is-winner>strong{color:#f2b84b!important;font-weight:950!important}.jmlc-poll-result-row.is-winner>i>b{background:#f2b84b!important}
@keyframes jmlcResultBar{from{width:0!important}}
@media(max-width:520px){.jmlc-poll-result{padding:8px!important}.jmlc-poll-result-card{padding:15px 11px 11px!important}.jmlc-pinned-media{max-width:180px!important}.jmlc-pinned-media img,.jmlc-pinned-media video{max-height:90px!important}}

/* v0.8.18 — @mention autocomplete */
.jmlc-mention-suggestions{position:absolute;left:8px;right:8px;bottom:calc(100% + 6px);z-index:1200;max-height:260px;overflow:auto;border:1px solid color-mix(in srgb,var(--c-brand) 28%,#38384a);border-radius:12px;background:#171722;box-shadow:0 12px 36px rgba(0,0,0,.42);padding:5px}
.jmlc-mention-suggestions[hidden]{display:none!important}
.jmlc-mention-suggestion{width:100%;display:flex;align-items:center;gap:9px;border:0;border-radius:8px;background:transparent;color:#f5f5f8;text-align:left;padding:8px;cursor:pointer}
.jmlc-mention-suggestion:hover,.jmlc-mention-suggestion.is-active{background:color-mix(in srgb,var(--c-brand) 20%,#252536)}
.jmlc-mention-suggestion img,.jmlc-mention-avatar-fallback{width:34px;height:34px;border-radius:50%;object-fit:cover;flex:0 0 34px}
.jmlc-mention-avatar-fallback{display:grid;place-items:center;background:#343449;font-weight:800}
.jmlc-mention-suggestion>span:last-child{display:flex;flex-direction:column;min-width:0}.jmlc-mention-suggestion strong,.jmlc-mention-suggestion small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.jmlc-mention-suggestion small{color:#a9a9ba;margin-top:1px}
@media(max-width:760px){.jmlc-mention-suggestions{left:4px;right:4px;max-height:min(220px,36vh)}}

/* v0.8.21 — exact picker grids: reactions 5x6 (30), custom emoji 5x8 (40) */
.jmlc-picker.is-reaction{width:min(344px,calc(100% - 16px))!important;max-height:286px!important}
.jmlc-picker.is-reaction .jmlc-picker-grid{grid-template-columns:repeat(6,minmax(0,1fr))!important;grid-auto-rows:40px!important;max-width:330px!important;margin:0 auto!important}
.jmlc-picker.is-emoji-keyboard .jmlc-emoji-content{grid-template-columns:repeat(8,minmax(0,1fr))!important}
.jmlc-picker.is-emoji-keyboard .jmlc-emoji-key{height:40px!important;min-width:0!important}
.jmlc-edit-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px;border-top:1px solid var(--c-line);background:color-mix(in srgb,var(--c-brand) 10%,var(--c-panel2));color:var(--c-text)}
.jmlc-edit-bar[hidden]{display:none!important}.jmlc-edit-bar>div{display:flex;min-width:0;flex-direction:column;gap:1px}.jmlc-edit-bar strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.jmlc-edit-bar button{border:0;background:transparent;color:var(--c-muted);cursor:pointer;font-size:16px}
@media(max-width:430px){.jmlc-picker.is-emoji-keyboard .jmlc-emoji-content{grid-template-columns:repeat(8,minmax(0,1fr))!important;padding-left:5px!important;padding-right:5px!important;gap:1px!important}.jmlc-picker.is-emoji-keyboard .jmlc-emoji-key{height:38px!important;font-size:20px!important}.jmlc-picker.is-emoji-keyboard .jmlc-emoji-key img{width:27px!important;height:27px!important}}


/* v0.8.26 — Hooligan Bot game answer UX */
.jmlc-bot-game-actions{display:flex;align-items:center;gap:7px;margin:5px 0 1px 0;flex-wrap:wrap}
.jmlc-bot-answer-button{border:1px solid color-mix(in srgb,var(--c-brand) 65%,var(--c-line));background:color-mix(in srgb,var(--c-brand) 16%,var(--c-panel2));color:var(--c-text);border-radius:9px;padding:5px 10px;font-size:11px;font-weight:800;cursor:pointer;line-height:1.2}
.jmlc-bot-answer-button:hover,.jmlc-bot-answer-button:focus-visible{background:color-mix(in srgb,var(--c-brand) 28%,var(--c-panel2));outline:none;box-shadow:0 0 0 2px color-mix(in srgb,var(--c-brand) 18%,transparent)}
.jmlc-bot-game-actions>span{font-size:9.5px;color:var(--c-muted)}
.jmlc-bot-answer-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 10px;border-top:1px solid color-mix(in srgb,var(--c-brand) 40%,var(--c-line));background:color-mix(in srgb,var(--c-brand) 13%,var(--c-panel2));color:var(--c-text)}
.jmlc-bot-answer-bar[hidden]{display:none!important}
.jmlc-bot-answer-bar>div{display:flex;min-width:0;flex-direction:column;gap:1px}
.jmlc-bot-answer-bar strong{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jmlc-bot-answer-bar button{border:0;background:transparent;color:var(--c-muted);cursor:pointer;font-size:16px}
@media (max-width:700px){.jmlc-bot-game-actions{margin-top:4px}.jmlc-bot-answer-button{min-height:30px;padding:5px 9px}.jmlc-bot-game-actions>span{font-size:9px}}


/* =========================================================
   v0.8.27 — mobile message-action visibility + reliable taps
   Keep desktop untouched. Mobile action toolbar gets an opaque,
   high-contrast surface and slightly larger touch targets. The JS
   companion widens the touch-slop allowance so normal finger drift
   does not cancel React / Reply / menu activation.
   ========================================================= */
@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions{
    background:color-mix(in srgb,var(--c-bg) 82%,var(--c-text) 18%)!important;
    border:1px solid color-mix(in srgb,var(--c-line) 68%,var(--c-text) 32%)!important;
    box-shadow:0 10px 26px rgba(0,0,0,.48)!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    isolation:isolate!important;
    overflow:visible!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions button{
    min-width:36px!important;
    width:36px!important;
    height:34px!important;
    border-radius:7px!important;
    color:var(--c-text)!important;
    background:color-mix(in srgb,var(--c-panel3) 72%,transparent)!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions button[data-action="react"]{
    min-width:42px!important;
    width:42px!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions button:active{
    background:var(--c-brand)!important;
    color:#fff!important;
  }
}


/* =========================================================
   v0.8.28 — compact mobile action grid + reaction-open guard companion
   The action menu is a small 3x2 icon palette instead of a long strip.
   Text labels remain available in titles/ARIA but are hidden visually on
   phones. Desktop remains unchanged.
   ========================================================= */
@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions{
    display:grid!important;
    grid-template-columns:repeat(3,42px)!important;
    grid-auto-rows:38px!important;
    width:138px!important;
    max-width:138px!important;
    right:5px!important;
    left:auto!important;
    top:29px!important;
    padding:5px!important;
    gap:4px!important;
    border-radius:11px!important;
    background:#162235!important;
    border:1px solid rgba(135,170,214,.42)!important;
    box-shadow:0 10px 28px rgba(0,0,0,.58)!important;
    overflow:hidden!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions button,
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions .jmlc-action-wide,
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions button[data-action="react"]{
    width:42px!important;
    min-width:42px!important;
    max-width:42px!important;
    height:38px!important;
    min-height:38px!important;
    padding:0!important;
    margin:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important;
    border-radius:8px!important;
    font-size:18px!important;
    line-height:1!important;
    background:#213149!important;
    border:1px solid rgba(255,255,255,.09)!important;
    color:#fff!important;
    overflow:hidden!important;
    white-space:nowrap!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions .jmlc-action-wide span{
    display:none!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions button:active{
    background:var(--c-brand)!important;
    transform:scale(.96)!important;
  }
}


/* =========================================================
   v0.8.29 — mobile action palette polish
   Preserve the compact mobile concept from v0.8.28 while improving visual
   rhythm, touch clarity and separation from the message beneath it.
   ========================================================= */
@media (max-width:760px), (pointer:coarse) and (orientation:portrait), (pointer:coarse) and (max-height:500px){
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions{
    padding:6px!important;
    gap:5px!important;
    border-radius:14px!important;
    background:rgba(18,32,50,.98)!important;
    border:1px solid rgba(128,175,226,.50)!important;
    box-shadow:0 12px 30px rgba(0,0,0,.52),0 0 0 1px rgba(255,255,255,.025) inset!important;
    backdrop-filter:none!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions button,
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions .jmlc-action-wide,
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions button[data-action="react"]{
    border-radius:10px!important;
    background:#20334d!important;
    border:1px solid rgba(255,255,255,.11)!important;
    box-shadow:0 1px 0 rgba(255,255,255,.035) inset!important;
    font-size:19px!important;
  }
  .jmlc-shell .jmlc-msg.jmlc-actions-open .jmlc-content-stack .jmlc-msg-actions button:focus-visible{
    outline:2px solid var(--c-brand)!important;
    outline-offset:1px!important;
  }
}