:root{
  --bg:#f0f2f5;
  --card:#ffffff;
  --line:#e4e6eb;
  --muted:#6b7280;
  --text:#111827;
  --blue:#1877f2;
  --shadow:0 2px 10px rgba(0,0,0,.07);
  --radius:14px;
}

*{ box-sizing:border-box; }

html{
  margin:0;
  padding:0;
}

body{
  margin:0;
  padding:0;
  background:var(--bg);
  font-family:Arimo, Arial, sans-serif;
  color:var(--text);
}

/* TOPBAR */
.topbar{
  position:static;
  margin:0;
  padding:0;
  background:rgba(255,255,255,.92);
  backdrop-filter: blur(8px);
  border-bottom:1px solid var(--line);
  display:block;
}

.topbar > center{
  margin:0;
  padding:0;
}

.topbar iframe{
  display:block;
  margin:0;
  padding:0;
  border:0;
  vertical-align:top;
}

/* Desktop main menu — match barmain.html */
#menu1,
#menu2,
#menu1 *,
#menu2 *{
  box-sizing:content-box;
}

#menu1,
#menu2{
  border-collapse:separate;
  border-spacing:2px;
  border:0;
}

a.gamelinks{
  color:#1098E9;
  text-decoration:none;
  font-size:12px;
  font-weight:bold;
  font-family:'Arimo', sans-serif;
  text-align:center;
  padding-right:3px;
  line-height:normal;
  letter-spacing:normal;
  white-space:nowrap;
}

#menu1 .vert,
#menu2 .vert{
  vertical-align:middle;
  text-align:center;
}

#menu1 .button,
#menu2 .button{
  text-align:center;
  width:80px;
  white-space:nowrap;
  vertical-align:middle;
}

#menu1 img,
#menu2 img{
  border:0;
  max-width:none;
  height:auto;
  display:inline;
  vertical-align:baseline;
}

#menu1 img[src*="left_btn"],
#menu2 img[src*="plus_btn"],
#menu2 img[src*="left_btn"]{
  width:27px;
  height:auto;
  padding:0 17px 0 0;
  margin:0 0 0 19px;
}

.shadowed-hr{
  border:none;
  height:1px;
  width:1300px;
  max-width:100%;
  background-color:#ccc;
  box-shadow:0 2px 4px rgba(0, 0, 0, 0.5);
  margin:0 auto;
}

.topbarInner{
  max-width:1300px;
  margin:0 auto;
  padding:10px 12px;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
}

.logo{ display:none; }

.search{
  display:flex;
  align-items:center;
  gap:8px;
  background:#f3f4f6;
  border:1px solid #eceff4;
  border-radius:999px;
  padding:8px 12px;
  min-width:0;
  margin:0;
}

.search input{
  border:0;
  outline:0;
  background:transparent;
  font-size:14px;
  width:100%;
  color:var(--text);
  line-height:1.2;
  margin:0;
  padding:0;
}

.searchNarrow{
  flex:0 0 190px;
  max-width:210px;
  align-self:center;
  height:32px;
  padding:0 10px;
  box-sizing:border-box;
}

.searchNarrow input{
  font-size:12px;
  line-height:1;
  height:100%;
}

.chipsInline{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  flex:1;
  overflow:hidden;
  justify-content:flex-start;
}

.chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line);
  background:#fff;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  line-height:1.2;
  height:32px;
  box-sizing:border-box;
  color:#374151;
  white-space:nowrap;
  cursor:pointer;
  user-select:none;
  transition:transform .12s ease, box-shadow .12s ease, color .12s ease;
  flex:0 0 auto;
  text-decoration:none;
}

.chip:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 16px rgba(0,0,0,.06);
  color:var(--blue);
}

.chip.active{
  border-color:rgba(24,119,242,.35);
  color:var(--blue);
}

.chip.isHidden{ display:none; }

.moreBtn{
  flex:0 0 auto;
  border:1px solid var(--line);
  background:#fff;
  border-radius:999px;
  padding:7px 12px;
  font-size:12px;
  cursor:pointer;
  color:#374151;
}

.morePanel{
  border-top:1px solid var(--line);
  background:#fff;
  display:none;
}

.morePanelInner{
  max-width:1300px;
  margin:0 auto;
  padding:10px 12px 14px;
}

.moreTitle{
  font-weight:700;
  font-size:13px;
  color:#374151;
  margin-bottom:10px;
}

.moreChips{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

/* LAYOUT + CARDS */
.layout{
  max-width:1300px;
  margin:0 auto 40px;
  padding:10px 12px 0;
}

.feedPageIntro{
  margin-bottom:16px;
  padding:18px 20px;
  text-align:center;
}

.feedPageIntro h1{
  margin:0;
  font-size:30px;
  line-height:1.2;
  color:#0f172a;
}

.feedPageIntro p{
  margin:10px auto 0;
  max-width:760px;
  font-size:15px;
  line-height:1.7;
  color:#475569;
}

.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  overflow:hidden;
}

/* FEED COLUMNS */
.feedColumns{
  display:flex;
  gap:10px;
  align-items:flex-start;
}

.feedColumnsInfinite{
  margin-top:10px;
}

.feedCol{
  flex:1 1 0;
  display:flex;
  flex-direction:column;
  gap:10px;
  min-width:0;
}

.feedColumns.feedColumns--single .feedCol:not(:first-child){
  display:none;
}

/* POST */
.postHeader{
  padding:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.postMeta{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.avatar{
  width:40px;
  height:40px;
  border-radius:14px;
  background:linear-gradient(135deg,#dbeafe,#fce7f3);
  border:1px solid #eef2ff;
  flex:0 0 auto;
}

.postType{
  font-weight:700;
  font-size:14px;
  color:var(--blue);
  line-height:1.2;
}

.home-main-h1{
  margin:0;
  padding:0;
  font-family:Arimo, Arial, sans-serif;
  font-size:11px;
  line-height:1.35;
  font-weight:700;
  color:#303846;
}

.home-about-content{
  width:calc(100% - 24px);
  max-width:1050px;
  margin:30px auto 18px;
  padding:22px 28px;
  box-sizing:border-box;
  background:#ffffff;
  border:1px solid #e4e6eb;
  border-radius:14px;
  font-family:Arimo, Arial, sans-serif;
  color:#3f4754;
  text-align:right;
  line-height:1.85;
}

.home-about-content h2{
  margin:0 0 12px;
  padding:0;
  text-align:center;
  font-size:21px;
  line-height:1.4;
  color:#202733;
}

.home-about-content p{
  margin:9px 0;
  padding:0;
  font-size:15px;
}

@media (max-width:700px){
  .home-about-content{
    width:calc(100% - 20px);
    margin:22px auto 14px;
    padding:18px 17px;
    line-height:1.75;
  }

  .home-about-content h2{
    font-size:19px;
  }

  .home-about-content p{
    font-size:14px;
  }
}

.dots3{
  width:38px;
  height:38px;
  border-radius:12px;
  border:1px solid #eef2f7;
  background:#fff;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  color:#6b7280;
}

.postContent{
  padding:0 12px 12px;
  font-size:16px;
  line-height:1.65;
  color:var(--text);
}

.post[data-type="joke"] .postContent,
.post[data-type="riddle"] .postContent,
.post[data-type="quotes"] .postContent{
  /* Align with .postType: header 12 + avatar 38 + postMeta gap 10 */
  padding-right:60px;
}

.post[data-type="riddle"] .postContent img{
  max-width:100%;
  height:auto;
  display:block;
  margin:8px auto;
  border-radius:8px;
}

.post[data-type="riddle"] .postContent a.riddleReadMore,
.post[data-type="riddle"] .postContent a.riddleReadMore strong,
.post[data-type="riddle"] .postContent button.riddleReadMore,
.post[data-type="riddle"] .postContent button.riddleReadMore strong,
.post.feedLite[data-type="riddle"] .postContent a.riddleReadMore,
.post.feedLite[data-type="riddle"] .postContent a.riddleReadMore strong,
.post.feedLite[data-type="riddle"] .postContent button.riddleReadMore,
.post.feedLite[data-type="riddle"] .postContent button.riddleReadMore strong{
  color:var(--blue);
  text-decoration:none;
}

.post[data-type="riddle"] .postContent a.riddleReadMore:hover,
.post[data-type="riddle"] .postContent a.riddleReadMore:hover strong,
.post[data-type="riddle"] .postContent button.riddleReadMore:hover,
.post[data-type="riddle"] .postContent button.riddleReadMore:hover strong,
.post.feedLite[data-type="riddle"] .postContent a.riddleReadMore:hover,
.post.feedLite[data-type="riddle"] .postContent a.riddleReadMore:hover strong,
.post.feedLite[data-type="riddle"] .postContent button.riddleReadMore:hover,
.post.feedLite[data-type="riddle"] .postContent button.riddleReadMore:hover strong{
  text-decoration:underline;
}

.post[data-type="joke"] .postContent a.jokeReadMore,
.post[data-type="joke"] .postContent a.jokeReadMore strong,
.post[data-type="joke"] .postContent button.jokeReadMore,
.post[data-type="joke"] .postContent button.jokeReadMore strong,
.post.feedLite[data-type="joke"] .postContent a.jokeReadMore,
.post.feedLite[data-type="joke"] .postContent a.jokeReadMore strong,
.post.feedLite[data-type="joke"] .postContent button.jokeReadMore,
.post.feedLite[data-type="joke"] .postContent button.jokeReadMore strong{
  color:var(--blue);
  text-decoration:none;
}

.post[data-type="joke"] .postContent a.jokeReadMore:hover,
.post[data-type="joke"] .postContent a.jokeReadMore:hover strong,
.post[data-type="joke"] .postContent button.jokeReadMore:hover,
.post[data-type="joke"] .postContent button.jokeReadMore:hover strong,
.post.feedLite[data-type="joke"] .postContent a.jokeReadMore:hover,
.post.feedLite[data-type="joke"] .postContent a.jokeReadMore:hover strong,
.post.feedLite[data-type="joke"] .postContent button.jokeReadMore:hover,
.post.feedLite[data-type="joke"] .postContent button.jokeReadMore:hover strong{
  text-decoration:underline;
}

.readMoreExcerptBody,
.readMoreExcerptEnd{
  display:inline;
}

.readMoreBlock.is-expanded .readMoreExcerpt{
  display:none !important;
}

.readMoreExcerptEnd{
  white-space:nowrap;
}

.readMoreToggle{
  display:inline;
  margin:0;
  padding:0;
  border:0;
  background:none;
  font:inherit;
  cursor:pointer;
}

.feedLite .postHeader{
  padding-bottom:8px;
}

.feedLite .postContent{
  padding-top:0;
}

.post[data-type="ad"] .postContent{
  text-align:center;
}

.postAdWrap{
  width:100%;
  max-width:100%;
  overflow:hidden;
  border:1px solid #e5e7eb;
  border-radius:12px;
  background:#f8fafc;
  padding:4px;
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

.postAdWrap iframe,
.postAdWrap img,
.postAdWrap object,
.postAdWrap embed,
.postAdWrap > div,
.postAdWrap > a{
  display:block;
  margin-left:auto;
  margin-right:auto;
  max-width:100%;
}

.feedLite .postAdWrap{
  padding:4px;
}

.post.feedLite[data-type="ad"] .postContent{
  padding-bottom:8px;
}

.feedLite .postActions{
  direction:ltr;
}

.feedLite .actionBtn{
  flex:1;
}

.feedLiteText{
  font-size:15px;
  line-height:1.7;
}

.feedLiteCaption{
  margin:10px 0 0;
  text-align:center;
  font-size:14px;
  font-weight:400;
  color:#111827;
}

.post[data-type="riddle"] .postContent a:not(.riddleReadMore):not(.actionBtn),
.post.feedLite[data-type="riddle"] .postContent a:not(.riddleReadMore):not(.actionBtn){
  color:var(--blue);
  font-weight:700;
  text-decoration:underline;
}

.post[data-type="riddle"] .postContent a:not(.riddleReadMore):not(.actionBtn):hover,
.post.feedLite[data-type="riddle"] .postContent a:not(.riddleReadMore):not(.actionBtn):hover{
  text-decoration:none;
}

.riddle-feed-text{
  overflow-wrap:anywhere;
  word-break:break-word;
}

.clamp4{
  display:-webkit-box;
  -webkit-line-clamp:4;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.clamp3{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.clamp7{
  display:-webkit-box;
  -webkit-line-clamp:7;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

/* MEDIA — ברירת מחדל index: עד 240×240, בלי object-fit: cover */
.postMedia{
  margin:10px auto 0;
  border-radius:12px;
  max-width:240px;
  max-height:240px;
  overflow:hidden;
  border:1px solid #eef2f7;
  align-items:center;
  justify-content:center;
}

.postMedia img,
.postMedia video,
.postMedia iframe{
  width:100%;
  display:block;
}

.postMedia a,
.postMediaLink{
  display:block;
  cursor:pointer;
}

.postMediaLink img,
.post[data-type="images"] .postMedia img,
.post[data-type="funny"] .postMedia img,
.post[data-type="coloring"] .postMedia img,
.post[data-type="ai_riddle"] .postMedia img,
.post[data-type="sketch"] .postMedia a{
  cursor:pointer;
}

.postMedia img{
  width:100%;
  max-width:240px;
  max-height:240px;
  height:auto;
  display:block;
  margin:0 auto;
  background:#fff;
}

.postMedia video{
  aspect-ratio:1 / 1;
  object-fit:cover;
  background:#000;
}

.postMedia iframe{
  min-height:220px;
  border:0;
  background:#fff;
}

.postMedia.postMediaFrame{
  max-width:256px;
}

.postMedia.postMediaFrame iframe{
  aspect-ratio:200 / 141;
  pointer-events:none;
}

.togetherBlockContent{
  text-align:center;
}

/* ארץ עיר (ee_block) — בלוק נפרד */
.post[data-type="ee_block"] .postMedia.togetherBlockMedia{
  max-width:420px;
  width:100%;
  min-height:350px;
  height:350px;
  max-height:none;
  margin:10px auto 0;
  overflow:hidden;
}

.post[data-type="ee_block"] .postMedia.togetherBlockMedia iframe{
  width:99%;
  max-width:420px;
  height:350px;
  min-height:350px;
  max-height:350px;
  margin:0 auto;
  border:0;
  border-radius:12px;
  background:#fff;
  pointer-events:auto;
  aspect-ratio:auto;
}

/* מי רואה ראשון (first_block) — בלוק נפרד, גובה שונה */
.post[data-type="first_block"] .postMedia.togetherBlockMedia{
  max-width:420px;
  width:100%;
  min-height:420px;
  height:420px;
  max-height:none;
  margin:10px auto 0;
  overflow:hidden;
}

.post[data-type="first_block"] .postMedia.togetherBlockMedia .togetherBlockPlayLink{
  display:block;
  width:100%;
  height:100%;
  line-height:0;
  color:inherit;
  text-decoration:none;
  cursor:pointer;
}

.post[data-type="first_block"] .postMedia.togetherBlockMedia iframe{
  width:99%;
  max-width:420px;
  height:420px;
  min-height:420px;
  max-height:420px;
  margin:0 auto;
  border:0;
  border-radius:12px;
  background:#fff;
  pointer-events:none;
  aspect-ratio:auto;
}

/* ACTIONS */
.postActions{
  display:flex;
  border-top:1px solid #f1f1f1;
  direction:ltr;
}

.actionBtn{
  flex:1;
  text-align:center;
  padding:11px 0;
  text-decoration:none;
  color:#374151;
  font-size:14px;
  font-weight:400;
  font-family:inherit;
  line-height:1.2;
  cursor:pointer;
  border:0;
  background:transparent;
  transition:background .15s ease, color .15s ease;
  direction:rtl;
  position:relative;
  appearance:none;
  -webkit-appearance:none;
  border-radius:0;
  margin:0;
}

/* מפריד בין כל שני כפתורים — עובד גם כשיש button+a מעורבבים */
.postActions .actionBtn + .actionBtn{
  box-shadow:inset 1px 0 0 #e5e7eb;
}

.actionBtn:hover{
  background:#f3f4f6;
  color:var(--blue);
}

/* GAME ROW */
.gameRow{
  display:flex;
  gap:12px;
  align-items:center;
  border:1px solid #eef2f7;
  background:#fff;
  border-radius:12px;
  padding:10px;
}

.gameThumb{
  width:84px;
  height:84px;
  object-fit:cover;
  border-radius:12px;
  flex:0 0 auto;
  border:1px solid #eef2f7;
}

.post[data-type="hangman"] .gameThumb{
  object-fit:contain;
  transform:scaleX(-1);
}

.gameThumbLink{
  display:block;
  line-height:0;
  flex:0 0 auto;
}

.gameInfo{ min-width:0; }
.gameName{ font-weight:700; font-size:15px; color:#111827; margin-bottom:4px; }
.gameDesc{ font-size:13px; color:#6b7280; line-height:1.5; }

.gameNameLink{
  color:inherit;
  text-decoration:none;
}

.gameNameLink:hover{
  color:var(--blue);
  text-decoration:underline;
}

.coolRollBtn{
  display:block;
  width:100%;
  box-sizing:border-box;
  text-align:center;
  padding:14px 16px;
  border-radius:12px;
  border:0;
  background:linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%);
  color:#fff;
  font-size:16px;
  font-weight:700;
  text-decoration:none;
  box-shadow:0 10px 22px rgba(37, 99, 235, 0.18);
  transition:transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.coolRollBtn:hover{
  color:#fff;
  transform:translateY(-1px);
  box-shadow:0 14px 26px rgba(37, 99, 235, 0.22);
}

/* MAGNIVIM (cool) RESULT LAYOUT */
.coolResult{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  padding:6px 0 2px;
}

.coolResultImg{
  width:220px;
  height:220px;
  object-fit:cover;
  border-radius:12px;
  border:1px solid #eef2f7;
  background:#fff;
}

.coolResultName{
  font-weight:800;
  font-size:16px;
  color:#111827;
  text-align:center;
  line-height:1.2;
}

.coolResultLabel{
  font-size:13px;
  font-weight:700;
  color:#6b7280;
  text-align:center;
  line-height:1.1;
  margin-top:0;
}

.coolRollBtnSmall{
  width:auto;
  max-width:260px;
  margin:0 auto;
  padding:12px 14px;
  border-radius:10px;
  font-size:15px;
  font-weight:800;
}

/* צבעים לפי סוג */
.post[data-type="joke"] .postType{ color:#16a34a; }
.post[data-type="riddle"] .postType{ color:#7c3aed; }
.post[data-type="ai_riddle"] .postType{ color:#0ea5e9; }
.post[data-type="coloring"] .postType{ color:#22c55e; }
.post[data-type="daily_word"] .postType{ color:#0ea5e9; }

/* ללמוד לצייר — תמונה גבוהה יותר, בלי כיתוב */
.post[data-type="learn_draw"] .postMedia{
  margin:10px auto 0;
  border-radius:12px;
  max-width:240px;
  max-height:270px;
  overflow:hidden;
  border:1px solid #eef2f7;
  align-items:center;
  justify-content:center;
}
.post[data-type="learn_draw"] .postMedia img{
  width:100%;
  max-width:240px;
  max-height:270px;
  height:auto;
  display:block;
  margin:0 auto;
  background:#fff;
}

/* מה הקשר — תצוגת מילים יומית */
.dailyWordPreview{
  width:100%;
  max-width:640px;
  margin:6px auto 0;
  border-radius:18px;
  border:1px solid #d8eef8;
  background:#f3fbff;
  padding:14px;
  box-sizing:border-box;
  box-shadow:0 10px 26px rgba(14, 165, 233, 0.10);
}
.dailyWordBadge{
  display:flex;
  width:100%;
  min-height:54px;
  align-items:center;
  justify-content:center;
  margin-bottom:12px;
  padding:12px 16px;
  border-radius:16px;
  background:linear-gradient(135deg, #22d3ee 0%, #38bdf8 52%, #0ea5e9 100%);
  color:#fff;
  box-shadow:0 12px 24px rgba(56, 189, 248, 0.22);
  text-decoration:none;
  font-size:17px;
  font-weight:800;
  letter-spacing:.2px;
  transition:transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.dailyWordBadge:hover{
  color:#fff;
  transform:translateY(-1px);
  box-shadow:0 16px 28px rgba(56, 189, 248, 0.26);
  opacity:.97;
}
.dailyWordGrid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
}
.dailyWordLabel{
  margin:2px 0 10px;
  color:#0284c7;
  font-size:13px;
  font-weight:700;
  text-align:center;
}
.dailyWordChip{
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid #dbeaf2;
  background:#fff;
  color:#1f2937;
  font-size:14px;
  font-weight:700;
  line-height:1.25;
  box-shadow:0 4px 12px rgba(14, 165, 233, 0.05);
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.dailyWordChip:hover{
  transform:translateY(-1px);
  border-color:#7dd3fc;
  box-shadow:0 8px 16px rgba(56, 189, 248, 0.12);
}
.dailyWordChip:nth-child(4n+1){
  background:linear-gradient(180deg, #ffffff 0%, #f0f9ff 100%);
}
.dailyWordChip:nth-child(4n+2){
  background:linear-gradient(180deg, #ffffff 0%, #f5fbff 100%);
}
.dailyWordChip:nth-child(4n+3){
  background:linear-gradient(180deg, #ffffff 0%, #eef9ff 100%);
}
.dailyWordChip:nth-child(4n+4){
  background:linear-gradient(180deg, #ffffff 0%, #f7fcff 100%);
}
.dailyWordEmpty{
  color:#475569;
  font-size:14px;
  line-height:1.6;
  padding:6px 0 2px;
}
@media (max-width: 700px){
  .dailyWordPreview{
    max-width:100%;
    padding:10px;
  }
  .dailyWordBadge{
    min-height:46px;
    margin-bottom:10px;
    padding:10px 12px;
    font-size:15px;
  }
  .dailyWordGrid{
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:6px;
  }
  .dailyWordLabel{
    margin:0 0 8px;
    font-size:12px;
  }
  .dailyWordChip{
    min-height:40px;
    padding:6px 4px;
    border-radius:10px;
    font-size:11px;
    line-height:1.15;
  }
}
.post[data-type="images"] .postType{ color:#06b6d4; }
.post[data-type="funny"] .postType{ color:#f97316; }
.post[data-type="video"] .postType{ color:#ef4444; }
.post[data-type="hangman"] .postType{ color:#0d9488; }
.post[data-type="cool"] .postType{ color:#f59e0b; }
.post[data-type="together_games"] .postType{ color:#8b5cf6; }
.post[data-type="together_games"] a.togetherGameImgLink{
  display:inline-block;
  line-height:0;
  border-radius:12px;
}
.post[data-type="together_games"] a.togetherGameImgLink:hover .coolResultImg{
  opacity:.92;
}
.post[data-type="quotes"] .postType{ color:#64748b; }
.post[data-type="game"] .postType{ color:#2563eb; }
.post[data-type="ee_block"] .postType{ color:#7c3aed; }
.post[data-type="first_block"] .postType{ color:#db2777; }

/* TOAST */
.toast{
  position:fixed;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  background:#111827;
  color:#fff;
  padding:10px 14px;
  border-radius:999px;
  font-size:13px;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s ease, transform .2s ease;
  z-index:80;
}
.toast.show{
  opacity:1;
  transform:translateX(-50%) translateY(-2px);
}

/* MENU */
.menu{
  position:fixed;
  z-index:90;
  background:#fff;
  border:1px solid var(--line);
  border-radius:14px;
  box-shadow:0 12px 30px rgba(0,0,0,.12);
  min-width:170px;
  max-width:170px;
  overflow:hidden;
  display:none;
}

.menu .menuLine{
  margin:0;
  padding:14px 16px 12px;
  text-align:right;
  font-size:13px;
  line-height:1.45;
  color:#374151;
}

.menu .menuShareWrap{
  display:flex;
  justify-content:center;
  padding:4px 12px 14px;
}

.menu .menuShareBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  width:auto;
  border:0;
  border-radius:20px;
  background:#35b86b;
  color:#fff;
  padding:8px 14px;
  font:600 15px Arial, sans-serif;
  cursor:pointer;
  text-align:center;
}

.menu .menuShareBtn:hover{
  background:#2ea05d;
}

.menu .menuShareBtn svg{
  flex-shrink:0;
}

.menu .sep{ height:1px; background:#f1f1f1; }

/* LOADING */
.feedLoadFooter{
  margin-top:10px;
}

.feedLoading{
  margin-top:0;
  border:1px solid #d9ecff;
  border-radius:18px;
  padding:16px 16px 14px;
  background:linear-gradient(180deg, #ffffff 0%, #f5fbff 100%);
  box-shadow:0 14px 34px rgba(56, 189, 248, 0.10);
  display:none;
}

.feedMoreCta{
  display:none;
  margin:0;
}

.feedMoreCta[hidden],
.feedPaginationLink[hidden]{
  display:none !important;
}

.feedPagination{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  width:100%;
  margin:0 0 12px;
  direction:rtl;
}

.feedPagination.feedPaginationToWall{
  position:relative;
  justify-content:flex-start;
  flex-wrap:nowrap;
}

.feedPagination.feedPaginationToWall .feedPaginationLinkPrev{
  position:relative;
  z-index:1;
}

.feedPagination.feedPaginationToWall .feedPaginationLinkWall{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  z-index:0;
}

.feedPagination.feedPaginationToWall .feedPaginationLinkWall:hover{
  transform:translateX(-50%) translateY(-1px);
}

.feedPaginationLinkPrev,
.feedPaginationLinkNext{
  flex:0 0 auto;
}

.feedPaginationActions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
  flex:1 1 auto;
  min-width:0;
}

.feedPaginationLink{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:120px;
  padding:10px 16px;
  border-radius:999px;
  border:1px solid #cbd5e1;
  background:#fff;
  color:#0f172a;
  text-decoration:none;
  font-size:14px;
  font-weight:700;
  line-height:1.4;
  white-space:nowrap;
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.feedPaginationLink:hover{
  transform:translateY(-1px);
  border-color:#93c5fd;
  box-shadow:0 10px 24px rgba(37, 99, 235, 0.10);
  color:#0f172a;
  background:#fff;
}

.feedMoreBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:220px;
  padding:14px 22px;
  border-radius:999px;
  border:1px solid #bfdbfe;
  background:linear-gradient(135deg, #2563eb 0%, #0ea5e9 100%);
  color:#fff;
  text-decoration:none;
  font-size:16px;
  font-weight:700;
  box-shadow:0 14px 30px rgba(37, 99, 235, 0.18);
  transition:transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}

.feedMoreBtn:hover{
  color:#fff;
  transform:translateY(-1px);
  box-shadow:0 18px 34px rgba(37, 99, 235, 0.22);
  opacity:.98;
}

.feedLoadingText{
  margin-bottom:12px;
  text-align:center;
  font-size:15px;
  font-weight:800;
  color:#0f172a;
}

.feedLoadingPulse{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
}

.feedLoadingPulse span{
  width:14px;
  height:14px;
  border-radius:999px;
  background:linear-gradient(135deg, #22d3ee 0%, #38bdf8 55%, #2563eb 100%);
  box-shadow:0 8px 18px rgba(37, 99, 235, 0.20);
  animation:feedPulse 1.1s infinite ease-in-out;
}

.feedLoadingPulse span:nth-child(2){ animation-delay:.16s; }
.feedLoadingPulse span:nth-child(3){ animation-delay:.32s; }

.feedLoading .row{ display:flex; gap:10px; align-items:center; }
.feedLoading .dot{
  width:42px;
  height:42px;
  border-radius:16px;
  background:linear-gradient(135deg,#dbeafe 0%, #e0f2fe 50%, #f0f9ff 100%);
  box-shadow:inset 0 0 0 1px rgba(191, 219, 254, .9);
}
.feedLoading .col{ flex:1; display:flex; flex-direction:column; gap:8px; }

.skeletonBar{
  height:12px;
  border-radius:999px;
  background:linear-gradient(90deg,#dbeafe 0%, #eff6ff 35%, #f0f9ff 55%, #dbeafe 100%);
  background-size:220% 100%;
  animation:shimmer 1.1s infinite linear;
}

@keyframes shimmer{
  0%{ background-position:0% 0%; }
  100%{ background-position:-200% 0%; }
}

@keyframes feedPulse{
  0%, 100%{
    transform:translateY(0) scale(.92);
    opacity:.72;
  }
  50%{
    transform:translateY(-5px) scale(1.08);
    opacity:1;
  }
}

.feedEntering{
  opacity:0;
  animation:feedEnter .28s ease forwards;
}

@keyframes feedEnter{
  from{ opacity:0; }
  to{ opacity:1; }
}

/* POOL visible by default (JS hides after successful init) */
#pool{ display:block; }

/* תאריכים מיוחדים היום */
.post[data-type="special_dates"]{
  background:linear-gradient(180deg, #fffdf8 0%, #fff 42%);
  border:1px solid #f3e6c8;
}

.post[data-type="special_dates"] .postType{
  color:#b45309;
  font-weight:800;
}

.specialDatesAvatar{
  width:38px;
  height:38px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  background:linear-gradient(135deg, #fff4d6, #ffe8a3);
  border:1px solid #f6d58b;
  flex:0 0 auto;
}

.specialDatesList{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.specialDatesList li{
  margin:0;
}

.specialDatesItem{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:11px 12px;
  border-radius:12px;
  border:1px solid #f0dfc0;
  background:linear-gradient(135deg, #fffaf0 0%, #fff6e4 100%);
  color:#0f172a;
  text-decoration:none;
  box-shadow:0 4px 14px rgba(180, 83, 9, .06);
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.specialDatesItem:hover{
  transform:translateY(-1px);
  border-color:#e8c078;
  box-shadow:0 8px 18px rgba(180, 83, 9, .12);
}

.specialDatesItemDate{
  font-size:12px;
  line-height:1.2;
  color:#9a6700;
  font-weight:700;
}

.specialDatesItemTitle{
  font-size:15px;
  line-height:1.35;
  color:#1f2937;
  font-weight:800;
}

/* בלוק מומלצים */
.post[data-type="recommended"] .postType{ color:#2563eb; }

.recGrid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:10px;
  margin-top:6px;
}

.recItem{
  text-decoration:none;
  text-align:center;
  border:1px solid #eef2f7;
  background:#fff;
  border-radius:12px;
  padding:10px 8px;
  display:flex;
  flex-direction:column;
  gap:8px;
  align-items:center;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.recItem:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 18px rgba(0,0,0,.06);
  border-color:#e5e7eb;
}

.recItem img{
  width:68px;
  height:68px;
  object-fit:contain;
  display:block;
}

/* סקר — גובה מינימלי רק עד שמגיע resize מה־iframe */
.post[data-type="survey"] iframe[data-survey-resize="1"]{
  min-height: 220px;
}
.post[data-type="survey"] iframe[data-survey-resize="1"][data-survey-height-set="1"]{
  min-height: 0;
}

.post[data-type="yo_news"] .recItem img{
  width:80px;
  height:80px;
  object-fit:cover;
  border-radius:12px;
  border:1px solid #eef2f7;
}

/* עוד חדשות מימין: עוד חדשות | עוד תכנים | לקיר של יויו */
.post[data-type="yo_news"] .postActions{
  direction: rtl;
}
.post[data-type="yo_news"] .postActions .actionBtn + .actionBtn{
  /* ב־RTL הקו צריך בצד השני מול ה־inset הרגיל של postActions */
  box-shadow: inset -1px 0 0 #e5e7eb;
}

.recLabel{
  color:#1098E9;
  font-size:12px;
  font-weight:700;
  line-height:1.2;
}

/* RESPONSIVE (וגם להסתיר topbar במובייל) */
@media (max-width: 900px){
  .topbar{
    display:none !important;
    height:0 !important;
    max-height:0 !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    overflow:hidden !important;
  }
  .topbarInner{ flex-wrap:wrap; }
  .searchNarrow{ flex:1; max-width:none; }
  .chipsInline{ overflow:auto; scrollbar-width:none; }
  .chipsInline::-webkit-scrollbar{ display:none; }
  .chip.isHidden{ display:inline-flex; }
  .feedPageIntro{
    padding:16px 14px;
  }
  .feedPageIntro h1{
    font-size:24px;
  }
  .feedPageIntro p{
    font-size:14px;
  }
  .feedPaginationLink,
  .feedMoreBtn{
    min-width:0;
    padding:10px 12px;
    font-size:13px;
  }
  .feedMoreBtn{
    width:auto;
    max-width:none;
  }
}


/* צבע לכותרת סוג */
.post[data-type="hot_games"] .postType{ color:#2563eb; }

/* משחקים חמים */
.hotGrid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr)); /* 3 ו-3 (כלומר 3 בעמודה) */
  gap:10px;
  margin-top:6px;
}

.hotItem{
  text-decoration:none;
  border:1px solid #eef2f7;
  background:#fff;
  border-radius:14px;
  padding:8px;
  display:flex;
  flex-direction:column;
  gap:8px;
  align-items:center;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.hotItem:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 18px rgba(0,0,0,.06);
  border-color:#e5e7eb;
}

.hotItem img{
  width:72px;
  height:72px;
  border-radius:16px;
  object-fit:cover;
  display:block;
  border:1px solid #eef2f7;
  background:#fff;
}

.hotLabel{
  font-size:12px;
  font-weight:700;
  color:#111827;
  line-height:1.15;
  text-align:center;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

/* מובייל */
@media (max-width: 520px){
  .hotGrid{ grid-template-columns:repeat(3, minmax(0, 1fr)); } /* יותר נוח בטלפון */
  .hotItem img{ width:78px; height:78px; }
}



  .postRotator .postType{ color:#2563eb; }

  .rotHeader{
    padding:12px;
  }

  .rotBar{
    display:flex;
    align-items:center;
    gap:10px;
    justify-content:flex-start;
    width:100%;
    direction:ltr; /* כדי שהטיימר יהיה משמאל והטאבים מימין */
  }

  /* הטאבים והטיימר באותה שורה */
  .rotTabs{
    display:flex;
    gap:8px;
    flex-wrap:nowrap;
    align-items:center;
    min-width:0;
    direction:rtl; /* טקסט עברי תקין בתוך הכפתורים */
  }

  .rotTab{
    border:1px solid var(--line);
    background:#fff;
    border-radius:999px;
    padding:7px 12px;
    font-family:inherit;
    font-size:12px;
    cursor:pointer;
    color:#374151;
    transition:transform .12s ease, box-shadow .12s ease, color .12s ease, border-color .12s ease;
  }

  .rotTab:hover{
    transform:translateY(-1px);
    box-shadow:0 6px 16px rgba(0,0,0,.06);
    color:var(--blue);
  }

  .rotTab.isActive{
    border-color:rgba(24,119,242,.65);
    color:#fff;
    background:var(--blue);
    box-shadow:0 10px 18px rgba(24,119,242,.18);
  }



  .rotTimer{
    flex:0 0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#bbf7d0;
    border:1px solid #eceff4;
    border-radius:999px;
    padding:6px 12px;
    user-select:none;
    white-space:nowrap;
  }

  /* טיימר גדול וברור */
  .rotTimerNum{
    font-size:18px;
    font-weight:800;
    color:#111827;
    line-height:1;
    min-width:22px;
    text-align:center;
  }

  .rotPanels{ margin-top:2px; }
  .rotPanel{ display:none; }
  .rotPanel.isActive{ display:block; }

  @media (max-width:520px){
    .rotBar{ gap:8px; }
    .rotTimer{ padding:6px 10px; }
    .rotTimerNum{ font-size:16px; }
    .rotTabs{ gap:6px; }
    .rotTab{ padding:7px 10px; }
  }
    .rotTimer{ padding:6px 10px; }
    .rotTabs{ gap:6px; }
    .rotTab{ padding:7px 10px; }
  }
  
  .chip{
  gap:8px; /* שיהיה רווח בין האימוג'י לטקסט */
}

.chipIcon{
  font-size:16px;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.chipText{
  display:inline-block;
  line-height:1;
}

/* ===== Mobile home header + sections (from index22, mobile only) ===== */
.top-header.mobileOnlyChrome{
  display:none;
  width:100%;
  min-height:58px;
  margin:0 0 8px;
  padding:0 2px;
  align-items:center;
  justify-content:center;
  gap:8px;
  background:transparent;
  border:0;
  box-sizing:border-box;
}

.mobileHomeTop{
  display:none;
  width:100%;
  background:#ffffff;
}

.mobileHomeShell{
  width:100%;
  max-width:760px;
  margin:0 auto;
  padding:0 8px 14px;
  text-align:center;
}

.mobileHomeShell a{
  color:inherit;
  text-decoration:none;
}

.mobileFeedRule{
  display:none;
  width:100%;
  height:0;
  margin:0;
  padding:0;
  border:0;
  border-top:1px solid #e8edf4;
  background:transparent;
}

.logo-link{
  display:block;
  flex:0 0 auto;
  line-height:0;
}

.site-logo{
  display:block;
  width:145px;
  max-width:40vw;
  height:auto;
  margin:0;
}

.header-search{
  display:flex;
  width:min(290px, 54vw);
  height:36px;
  margin:0;
  overflow:hidden;
  background:#ffffff;
  border:1px solid #d9e2ec;
  border-radius:18px;
  box-shadow:0 3px 10px rgba(32, 52, 78, 0.09);
  box-sizing:border-box;
}

.header-search input{
  width:100%;
  min-width:0;
  height:34px;
  padding:0 12px 0 5px;
  color:#172033;
  background:transparent;
  border:0;
  outline:0;
  font-family:Arimo, Arial, sans-serif;
  font-size:13px;
  text-align:right;
}

.header-search button{
  width:39px;
  min-width:39px;
  height:34px;
  padding:0;
  color:#ffffff;
  background:#2e9df5;
  border:0;
  cursor:pointer;
  font-size:17px;
  line-height:34px;
}

.mobileHomeShell .games-section,
.mobileHomeShell .categories-section{
  margin:0 0 14px;
  padding:4px 7px 4px;
  background:#f7f9fc;
  border:1px solid #e8edf4;
  border-radius:18px;
  box-shadow:0 5px 18px rgba(42, 64, 94, 0.08);
  overflow:hidden;
}

.mobileHomeShell .section-title-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:30px;
  margin:0 4px 3px;
}

.mobileHomeShell .games-section .section-title-row{
  margin-bottom:-1px;
}

.mobileHomeShell .section-title{
  margin:0;
  font-size:18px;
  line-height:1.2;
  font-weight:700;
  color:#172033;
}

.mobileHomeShell .section-title-mark{
  width:8px;
  height:8px;
  margin-left:7px;
  display:inline-block;
  border-radius:50%;
  vertical-align:2px;
  background:#2e9df5;
  box-shadow:0 0 0 5px rgba(46, 157, 245, 0.13);
}

.mobileHomeShell .new-section .section-title-mark{
  background:#2fbd68;
  box-shadow:0 0 0 5px rgba(47, 189, 104, 0.15);
}

.mobileHomeShell .popular-section .section-title-mark{
  background:#ffb11b;
  box-shadow:0 0 0 5px rgba(255, 177, 27, 0.15);
}

.mobileHomeShell .title-link{
  display:inline-flex;
  align-items:center;
  gap:3px;
  color:#247cc1;
  font-size:11px;
  line-height:1;
  font-weight:700;
  white-space:nowrap;
}

.mobileHomeShell .title-link:active{
  opacity:0.7;
}

.mobileHomeShell .title-link-plus{
  display:inline-block;
  color:#247cc1;
  background:transparent;
  font-size:14px;
  line-height:1;
  font-weight:700;
}

.mobileHomeShell .game-card{
  width:100%;
  min-width:0;
}

.mobileHomeShell .game-card-link{
  display:block;
  padding:4px 3px 6px;
  border-radius:14px;
  transition:transform 0.18s ease, background 0.18s ease;
}

.mobileHomeShell .game-card-link:active{
  transform:scale(0.96);
  background:#eef4fb;
}

.mobileHomeShell .game-thumb-wrap{
  position:relative;
  display:block;
  width:78px;
  height:78px;
  max-width:100%;
  margin:0 auto 5px;
  padding:3px;
  background:#ffffff;
  border:1px solid #e6ebf1;
  border-radius:15px;
  box-shadow:0 5px 12px rgba(24, 43, 70, 0.15);
  line-height:0;
}

.mobileHomeShell .game-thumb{
  display:block;
  width:70px;
  height:70px;
  max-width:100%;
  border:0;
  border-radius:12px;
}

.mobileHomeShell .game-name{
  display:block;
  width:100%;
  height:18px;
  overflow:hidden;
  padding:0 2px;
  color:#182235;
  font-size:11px;
  line-height:18px;
  font-weight:600;
  text-align:center;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.mobileHomeShell .owl-carousel .owl-stage{
  display:flex;
  align-items:stretch;
}

.mobileHomeShell .owl-carousel .owl-item{
  float:none;
}

.mobileHomeShell .owl-carousel .owl-nav,
.mobileHomeShell .owl-carousel .owl-dots{
  display:none;
}

.mobileHomeShell .categories-section{
  padding-bottom:5px;
  margin-bottom:0;
}

.mobileHomeShell .categories-grid{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:7px 4px;
}

.mobileHomeShell .categories-grid:not(.open) .category-card:nth-child(n+11){
  display:none;
}

.mobileHomeShell .categories-toggle{
  display:block;
  width:64px;
  height:24px;
  margin:7px auto 0;
  padding:0;
  color:#247cc1;
  background:#ffffff;
  border:1px solid #cfe3f4;
  border-radius:18px;
  box-shadow:0 2px 7px rgba(32, 52, 78, 0.11);
  cursor:pointer;
  font-size:16px;
  font-weight:700;
  line-height:21px;
  transition:transform 0.2s ease;
}

.mobileHomeShell .categories-toggle.open{
  transform:rotate(180deg);
}

.mobileHomeShell .category-card{
  min-width:0;
}

.mobileHomeShell .category-link{
  display:flex;
  min-height:73px;
  padding:6px 1px 4px;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  background:#ffffff;
  border:1px solid #e7ebf1;
  border-radius:13px;
  box-shadow:0 3px 9px rgba(32, 52, 78, 0.08);
  transition:transform 0.18s ease, border-color 0.18s ease;
}

.mobileHomeShell .category-link:active{
  transform:scale(0.95);
  border-color:#a9d5f5;
}

.mobileHomeShell .category-icon-box{
  display:flex;
  width:46px;
  height:46px;
  margin:0 auto 4px;
  align-items:center;
  justify-content:center;
  background:#f8fafc;
  border-radius:11px;
}

.mobileHomeShell .category-icon{
  display:block;
  width:42px;
  height:42px;
  border:0;
  border-radius:10px;
}

.mobileHomeShell .category-name{
  display:block;
  width:100%;
  height:24px;
  overflow:hidden;
  color:#1f2b3e;
  font-size:9.5px;
  line-height:12px;
  font-weight:700;
  text-align:center;
}

@media (max-width: 900px){
  html,
  body.isMobileHome{
    margin:0 !important;
    padding:0 !important;
    background:#f0f2f5;
  }
  body.isMobileHome .mobileHomeTop{
    display:block;
  }
  body.isMobileHome .mobileFeedRule{
    display:block;
  }
  body.isMobileHome .top-header.mobileOnlyChrome,
  .top-header.mobileOnlyChrome{
    display:flex;
    position:static;
    margin:0 0 8px;
    padding:0 2px;
    border:0;
    background:transparent;
  }
  /* הפיד מתחיל באזור האפור */
  body.isMobileHome .layout{
    margin-top:0;
    padding-top:10px;
  }
}

/* גם מחוץ ל-media: עמוד מובייל (UA) תמיד מציג את האזור הלבן */
body.isMobileHome{
  background:#f0f2f5;
}
body.isMobileHome .mobileHomeTop{
  display:block;
}
body.isMobileHome .mobileFeedRule{
  display:block;
}
body.isMobileHome .top-header.mobileOnlyChrome{
  display:flex;
}

@media (max-width: 360px){
  .top-header.mobileOnlyChrome{
    gap:5px;
  }
  .site-logo{
    width:125px;
    max-width:38vw;
  }
  .header-search{
    width:56vw;
  }
  .header-search input{
    padding-right:9px;
    font-size:12px;
  }
}

@media (min-width: 420px){
  .mobileHomeShell{
    padding-right:12px;
    padding-left:12px;
  }
  .mobileHomeShell .game-thumb-wrap{
    width:84px;
    height:84px;
  }
  .mobileHomeShell .game-thumb{
    width:76px;
    height:76px;
  }
  .mobileHomeShell .game-name{
    font-size:11.5px;
  }
  .mobileHomeShell .categories-grid{
    gap:9px 6px;
  }
  .mobileHomeShell .category-link{
    min-height:78px;
  }
  .mobileHomeShell .category-icon-box{
    width:50px;
    height:50px;
  }
  .mobileHomeShell .category-icon{
    width:46px;
    height:46px;
  }
  .mobileHomeShell .category-name{
    font-size:10.5px;
  }
}

@media (min-width: 700px){
  .site-logo{
    width:170px;
  }
  .mobileHomeShell .games-section,
  .mobileHomeShell .categories-section{
    padding-right:12px;
    padding-left:12px;
  }
}

@media (min-width: 901px){
  .mobileHomeTop,
  .mobileFeedRule{
    display:none !important;
  }
}