/* JoyJoy V520 — unified Shieldy previews, white Tools cards and random-reaction cleanup. */

/* --------------------------------------------------------------------------
   Shared current preview language — same visual system as "Свои сообщения".
   -------------------------------------------------------------------------- */
body[data-account-page="bots"] .jj-v520-message-preview{
  min-width:0;
  color:var(--account-text,#17212b);
}
body[data-account-page="bots"] .jj-v520-preview-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin:0 0 12px;
}
body[data-account-page="bots"] .jj-v520-preview-heading>div{
  display:grid;
  gap:3px;
  min-width:0;
}
body[data-account-page="bots"] .jj-v520-preview-heading strong{
  color:var(--account-text,#17212b);
  font-size:14px;
  font-weight:900;
  line-height:1.25;
}
body[data-account-page="bots"] .jj-v520-preview-heading small{
  color:var(--account-muted,#718096);
  font-size:11px;
  line-height:1.4;
}
body[data-account-page="bots"] .jj-v520-preview-stage{
  min-width:0;
  min-height:250px;
  padding:16px;
  overflow:hidden;
  border:1px solid var(--account-line,#d8dee4);
  border-radius:14px;
  background:var(--account-soft,#f3f5f7);
}
body[data-account-page="bots"] .jj-v520-message-row{
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:start;
  gap:10px;
  min-width:0;
}
body[data-account-page="bots"] .jj-v520-message-avatar{
  width:38px;
  height:38px;
  display:block;
  object-fit:cover;
  border:1px solid color-mix(in srgb,var(--account-line,#d8dee4) 80%,transparent);
  border-radius:50%;
  background:#fff;
}
body[data-account-page="bots"] .jj-v520-message-body{
  min-width:0;
}
body[data-account-page="bots"] .jj-v520-message-author{
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:6px;
  min-width:0;
  margin:0 0 5px;
}
body[data-account-page="bots"] .jj-v520-message-author strong{
  display:inline-flex;
  align-items:center;
  gap:4px;
  color:var(--account-text,#17212b)!important;
  font-size:13px;
  font-weight:900;
  line-height:1.25;
}
body[data-account-page="bots"] .jj-v520-message-author small{
  color:var(--account-muted,#718096)!important;
  font-size:10px;
  line-height:1.3;
}
body[data-account-page="bots"] .jj-v520-message-text{
  margin:0;
  color:var(--account-text-secondary,#27313b)!important;
  font-size:13px;
  line-height:1.5;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
body[data-account-page="bots"] .jj-v520-embed{
  --jj-preview-accent:#2da44e;
  position:relative;
  display:grid;
  gap:8px;
  min-width:0;
  margin-top:8px;
  padding:13px 14px;
  overflow:hidden;
  border:1px solid var(--account-line,#d8dee4)!important;
  border-left:4px solid var(--timer-accent,var(--poll-accent,var(--jj-preview-accent)))!important;
  border-radius:8px!important;
  background:var(--account-surface,#fff)!important;
  box-shadow:none!important;
  color:var(--account-text,#17212b)!important;
}
body[data-account-page="bots"] .jj-v520-embed[hidden]{display:none!important}
body[data-account-page="bots"] .jj-v520-embed>img{
  width:calc(100% + 28px);
  max-height:180px;
  margin:-13px -14px 3px;
  object-fit:cover;
  border-radius:4px 4px 0 0;
}
body[data-account-page="bots"] .jj-v520-embed>img[hidden]{display:none!important}
body[data-account-page="bots"] .jj-v520-embed h4{
  margin:0;
  color:var(--account-text,#17212b)!important;
  font-size:14px;
  line-height:1.35;
}
body[data-account-page="bots"] .jj-v520-embed p{
  margin:0;
  color:var(--account-text-secondary,#344054)!important;
  font-size:12px;
  line-height:1.5;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}
body[data-account-page="bots"] .jj-v520-embed>small{
  color:var(--account-muted,#718096)!important;
  font-size:10px;
  line-height:1.35;
}
body[data-account-page="bots"] .jj-v520-preview-actions{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:7px;
}
body[data-account-page="bots"] .jj-v520-preview-actions[hidden]{display:none!important}
body[data-account-page="bots"] .jj-v520-preview-actions>span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:6px 10px;
  border:1px solid var(--account-line,#cfd6de);
  border-radius:7px;
  background:var(--account-surface,#fff);
  color:var(--account-text,#27313b);
  font-size:11px;
  font-weight:800;
}

/* --------------------------------------------------------------------------
   Welcome: preview is moved outside the editor card by V520 JS.
   -------------------------------------------------------------------------- */
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(360px,440px);
  align-items:start;
  gap:18px;
  min-width:0;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout>.welcome-event-card{
  grid-column:1;
  min-width:0;
  margin:0;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout>.welcome-inline-preview{
  grid-column:2;
  position:sticky!important;
  top:18px;
  align-self:start;
  width:100%!important;
  min-width:0;
  margin:0!important;
  padding:0!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout>.welcome-inline-preview[hidden]{display:none!important}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout>.welcome-inline-preview:not([hidden]){display:block!important}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-event-workspace{
  display:block!important;
  grid-template-columns:none!important;
  min-width:0;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-dependent{
  width:100%;
  min-width:0;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-preview-card{
  width:100%!important;
  min-width:0;
  margin:0!important;
  padding:16px!important;
  border:1px solid var(--account-line,#d8dee4)!important;
  border-radius:14px!important;
  background:var(--account-surface,#fff)!important;
  box-shadow:0 10px 26px rgba(31,45,61,.06)!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .preview-card-title{
  align-items:flex-start;
  margin:0 0 12px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .preview-card-title h3{
  margin:0;
  color:var(--account-text,#17212b);
  font-size:14px;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .preview-card-title p{
  margin:3px 0 0;
  color:var(--account-muted,#718096);
  font-size:11px;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .shieldy-direct-message-preview-v504{
  min-width:0!important;
  min-height:330px!important;
  padding:16px!important;
  overflow:hidden!important;
  border:1px solid var(--account-line,#d8dee4)!important;
  border-radius:14px!important;
  background:var(--account-soft,#f3f5f7)!important;
  box-shadow:none!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-preview-message-stack{
  display:grid!important;
  gap:12px!important;
  min-width:0;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-preview-message-block{
  display:block!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  color:var(--account-text,#17212b)!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-message-author{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  align-items:center!important;
  gap:10px!important;
  margin:0 0 6px!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-message-author>img{
  width:38px!important;
  height:38px!important;
  border-radius:50%!important;
  object-fit:cover!important;
  background:#fff!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-message-author>div{
  display:flex!important;
  align-items:baseline!important;
  flex-wrap:wrap!important;
  gap:6px!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-message-author strong{
  color:var(--account-text,#17212b)!important;
  font-size:13px!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-message-author small{
  color:var(--account-muted,#718096)!important;
  font-size:10px!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout :is(.welcome-mention-preview,.shieldy-preview-plain-text,[data-preview-primary-card-slot],[data-preview-secondary-card-slot]){
  width:auto!important;
  min-width:0!important;
  margin-left:48px!important;
  margin-right:0!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-mention-preview{
  display:inline-block!important;
  max-width:calc(100% - 48px)!important;
  margin-bottom:6px!important;
  padding:2px 5px!important;
  border-radius:3px!important;
  background:#d9f0ff!important;
  color:#0969da!important;
  font-size:11px!important;
  font-weight:800!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-mention-preview[hidden]{display:none!important}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .shieldy-preview-plain-text{
  margin-top:0!important;
  margin-bottom:8px!important;
  color:var(--account-text-secondary,#27313b)!important;
  font-size:12px!important;
  line-height:1.5!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-preview-secondary-message{
  padding-left:48px!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-preview-secondary-message [data-preview-secondary-card-slot]{
  margin-left:0!important;
}
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout [data-preview-primary-card-slot] .welcome-embed-preview,
body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout [data-preview-secondary-card-slot] .welcome-embed-preview{
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
}

/* --------------------------------------------------------------------------
   Tools: top-level cards are white; settings stay grouped but no old blue fill.
   -------------------------------------------------------------------------- */
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"]>.console-stack>.flexible-feature-card,
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .flexible-feature-card{
  background:var(--account-surface,#fff)!important;
  border-color:color-mix(in srgb,#2da44e 34%,var(--account-line,#d8dee4))!important;
  box-shadow:0 8px 22px rgba(31,45,61,.045)!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .flexible-feature-card>.card-title{
  background:var(--account-surface,#fff)!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .feature-settings-body{
  background:var(--account-surface,#fff)!important;
  border-top-color:var(--account-line,#d8dee4)!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .feature-settings-body :is(.field,.feature-toggle-grid>label,.shieldy-random-reaction-example,.shieldy-poll-customization,.shieldy-poll-stats){
  background:var(--account-surface,#fff);
}

/* Current timer preview, without the obsolete Lolka app bar/composer. */
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .shieldy-message-timer-preview{
  position:sticky;
  top:18px;
  min-width:0;
  padding:16px!important;
  border:1px solid var(--account-line,#d8dee4)!important;
  border-radius:14px!important;
  background:var(--account-surface,#fff)!important;
  box-shadow:0 10px 26px rgba(31,45,61,.06)!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .timer-preview-stage-v520{
  min-height:300px;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .timer-preview-message{
  margin:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .timer-preview-plain-text{
  margin:0!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .timer-preview-embed{
  --jj-preview-accent:var(--timer-accent,#2da44e);
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .timer-preview-meta{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px!important;
  margin-top:10px!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .timer-preview-meta>div{
  display:grid!important;
  gap:2px!important;
  padding:9px 10px!important;
  border:1px solid var(--account-line,#d8dee4)!important;
  border-radius:9px!important;
  background:var(--account-soft,#f7f9fb)!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .timer-preview-meta span{
  color:var(--account-muted,#718096)!important;
  font-size:9px!important;
  text-transform:uppercase;
  letter-spacing:.04em;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .timer-preview-meta strong{
  color:var(--account-text,#17212b)!important;
  font-size:11px!important;
}

/* Current poll preview, matching timer and custom-message previews. */
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview{
  position:relative!important;
  overflow:visible!important;
  padding:16px!important;
  border:1px solid var(--account-line,#d8dee4)!important;
  border-radius:14px!important;
  background:var(--account-surface,#fff)!important;
  color:var(--account-text,#17212b)!important;
  box-shadow:0 10px 26px rgba(31,45,61,.06)!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .shieldy-poll-preview-stage-v520{
  min-height:300px;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-head{
  display:flex!important;
  align-items:baseline!important;
  flex-wrap:wrap!important;
  gap:6px!important;
  margin:0 0 5px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-head strong{
  color:var(--account-text,#17212b)!important;
  font-size:13px!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-head small{
  color:var(--account-muted,#718096)!important;
  font-size:10px!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-card{
  --jj-preview-accent:var(--poll-accent,#2da44e);
  margin:8px 0 0!important;
  padding:13px 14px!important;
  border:1px solid var(--account-line,#d8dee4)!important;
  border-left:4px solid var(--poll-accent,#2da44e)!important;
  border-radius:8px!important;
  background:var(--account-surface,#fff)!important;
  box-shadow:none!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-card>span{
  color:var(--account-muted,#718096)!important;
  font-size:10px!important;
  font-weight:900!important;
  text-transform:uppercase;
  letter-spacing:.05em;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-card h4{
  color:var(--account-text,#17212b)!important;
  font-size:14px!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-card>small{
  color:var(--account-muted,#718096)!important;
  font-size:10px!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-options{
  display:grid!important;
  gap:7px!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-option{
  position:relative!important;
  overflow:hidden!important;
  min-height:34px!important;
  padding:8px 10px!important;
  border:1px solid var(--account-line,#d8dee4)!important;
  border-radius:7px!important;
  background:var(--account-soft,#f7f9fb)!important;
  color:var(--account-text-secondary,#27313b)!important;
  font-size:11px!important;
  font-weight:800!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-option::after{
  background:color-mix(in srgb,var(--poll-accent,#2da44e) 14%,transparent)!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-option>span{
  color:inherit!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] #shieldy-poll-preview .shieldy-poll-preview-image-v477{
  width:calc(100% + 28px)!important;
  max-width:none!important;
  height:auto!important;
  max-height:180px!important;
  margin:-13px -14px 3px!important;
  object-fit:cover!important;
  border-radius:4px 4px 0 0!important;
}

/* Random reaction: no compatibility number boxes under the range sliders. */
body[data-account-page="bots"] #shieldy-random-reaction-percent-number,
body[data-account-page="bots"] #shieldy-random-reaction-cycle-number,
body[data-account-page="bots"] .shieldy-random-number-compat-v520{
  display:none!important;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .jj-emoji-picker-v514 .jj-emoji-picker-icon-v514{
  overflow:hidden;
  white-space:nowrap;
}

/* Buttons must remain above preview layers and clickable. */
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] button,
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] input,
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] select,
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] textarea{
  position:relative;
  z-index:1;
}
body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .jj-v520-preview-stage{
  position:relative;
  z-index:0;
}

@media(max-width:1280px){
  body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout{
    grid-template-columns:minmax(0,1fr) minmax(330px,390px);
  }
}
@media(max-width:1080px){
  body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout{
    grid-template-columns:1fr;
  }
  body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout>.welcome-inline-preview{
    grid-column:1;
    position:static!important;
  }
  body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .shieldy-message-timer-preview{
    position:static;
  }
}
@media(max-width:640px){
  body[data-account-page="bots"] .jj-v520-preview-stage,
  body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .shieldy-direct-message-preview-v504{
    min-height:220px!important;
    padding:12px!important;
  }
  body[data-account-page="bots"] .jj-v520-preview-heading{
    align-items:flex-start;
    flex-direction:column;
  }
  body[data-account-page="bots"] #panel-bot-control [data-module-panel="sh-other"] .timer-preview-meta{
    grid-template-columns:1fr;
  }
  body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout :is(.welcome-mention-preview,.shieldy-preview-plain-text,[data-preview-primary-card-slot],[data-preview-secondary-card-slot]){
    margin-left:0!important;
  }
  body[data-account-page="bots"] :is(#shieldy-welcome-form,#shieldy-farewell-form).v520-welcome-preview-layout .welcome-preview-secondary-message{
    padding-left:0!important;
  }
}

/* Explicit dark-theme compatibility without restoring the obsolete black app window. */
html[data-theme="dark"] body[data-account-page="bots"] .jj-v520-preview-stage,
body.theme-dark[data-account-page="bots"] .jj-v520-preview-stage{
  background:var(--account-soft,#1e2630)!important;
}