/* TellJar 1.10.58 — unified approved hero jars + translated interface label */
.jarStage{
  width:min(430px,88vw)!important;
  height:auto!important;
  aspect-ratio:1/1!important;
  overflow:visible!important;
  margin-inline:auto!important;
  isolation:isolate;
}
.jarLogo{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  border-radius:0!important;
  filter:drop-shadow(0 24px 30px rgba(22,67,89,.13))!important;
  pointer-events:none!important;
  user-select:none!important;
  -webkit-user-drag:none!important;
}
body.jar-women .jarLogo{
  filter:drop-shadow(0 24px 30px rgba(175,55,119,.16))!important;
}
body.jar-men .jarLogo{
  filter:drop-shadow(0 24px 30px rgba(10,37,66,.18))!important;
}
/*
   The artwork stays identical in every language. The white front panel below
   is UI, not baked text: it masks the source-language lettering in the artwork
   and renders the current jar/topic label dynamically.
*/
.jarCardCover{
  position:absolute!important;
  z-index:3!important;
  left:50%!important;
  top:65.1%!important;
  width:35.5%!important;
  height:22.5%!important;
  transform:translate(-50%,-50%) rotate(-1.3deg)!important;
  box-sizing:border-box!important;
  display:grid!important;
  place-items:center!important;
  padding:10px 11px!important;
  overflow:hidden!important;
  background:#fff!important;
  border:1.5px solid rgba(112,163,189,.48)!important;
  border-radius:17px!important;
  box-shadow:0 8px 18px rgba(25,72,94,.08)!important;
  pointer-events:none!important;
}
body.jar-women .jarCardCover{
  background:#fff!important;
  border-color:rgba(221,91,151,.45)!important;
}
body.jar-men .jarCardCover{
  background:#fff!important;
  border-color:rgba(41,87,128,.42)!important;
}
.jarFrontLabel{
  width:100%!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  color:#06243b!important;
  font-size:17px!important;
  font-weight:950!important;
  line-height:1.04!important;
  letter-spacing:-.045em!important;
  text-align:center!important;
  text-wrap:balance!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
  transform:none!important;
}
.jarFrontLabel .accent{color:#0b978d!important}
body.jar-women .jarFrontLabel .accent{color:#e21869!important}
body.jar-men .jarFrontLabel .accent{color:#0b4f8d!important}
.jarFrontLabel.jarLabelSmall{font-size:14.5px!important;line-height:1.03!important}
.jarFrontLabel.jarLabelTiny{font-size:12.2px!important;line-height:1.02!important;letter-spacing:-.035em!important}
.jarFrontLabel.jarLabelMicro{font-size:10.7px!important;line-height:1.01!important;letter-spacing:-.025em!important}
/* Old 1.10.56 rule hid the HTML label for the Polish jar. Never hide it now. */
.heroJarEmbeddedLabel .jarCardCover{display:grid!important}
@media(max-width:760px){
  .jarStage{width:min(342px,86vw)!important}
  .jarCardCover{width:35.8%!important;height:22.8%!important;padding:8px 9px!important;border-radius:14px!important}
  .jarFrontLabel{font-size:13px!important}
  .jarFrontLabel.jarLabelSmall{font-size:11.5px!important}
  .jarFrontLabel.jarLabelTiny{font-size:10px!important}
  .jarFrontLabel.jarLabelMicro{font-size:8.9px!important}
}
@media(max-width:390px){
  .jarStage{width:min(318px,84vw)!important}
  .jarCardCover{padding:7px 8px!important}
  .jarFrontLabel{font-size:12px!important}
  .jarFrontLabel.jarLabelSmall{font-size:10.6px!important}
  .jarFrontLabel.jarLabelTiny{font-size:9.2px!important}
  .jarFrontLabel.jarLabelMicro{font-size:8.2px!important}
}
