/* NOLIFER: doplňky pro stránky světů (/hf/, /essence/). Načítá se za style.css.
   - hero štítek se stavem světa (LIVE / OPEN BETA / ANNOUNCED / OFFLINE)
   - kostry plakátů novinek, dokud nedorazí API
   - pásy „První kroky" a „Komunita" na přehledu světa
   - ticker bez pohybu (omezit pohyb) */

/* stav světa v hero: offline = červená tečka bez pulzu */
.hero-label .sep{opacity:.5}
.hero-label[data-status="offline"] .dot{background:var(--danger);animation:none}
.hero-label[data-status="live"] .dot{background:var(--ok)}
.hero-label[data-status="beta"] .dot{background:var(--beta)}

/* přepínač světů: svět s vypnutým portem má šedou tečku */
.wseg[data-status="offline"] .dot{background:var(--off)}
.liveline[data-status="offline"] .dot{background:var(--danger);animation:none}

/* kostry plakátů, než dorazí novinky */
.poster.is-skeleton{background:linear-gradient(110deg,var(--panel) 30%,rgba(255,255,255,.04) 45%,var(--panel) 60%);background-size:220% 100%;animation:ov-shimmer 1.6s linear infinite;border-color:var(--line)}
@keyframes ov-shimmer{from{background-position:120% 0}to{background-position:-100% 0}}
.latest .empty{grid-column:1 / -1;padding:36px 20px;border:1px dashed var(--line-10);border-radius:var(--r-card)}

/* ticker: dokud neběží JS nebo je pohyb omezený, položky se jen posouvají prstem */
.ticker-dup{display:contents}
.ticker-track.is-static{animation:none;width:auto;overflow-x:auto;scrollbar-width:none}
.ticker-track.is-static::-webkit-scrollbar{display:none}

/* první kroky: kompaktní pás se třemi kroky */
.ov-steps{padding:64px var(--gx);border-top:1px solid var(--line)}
.ov-steps-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:24px;flex-wrap:wrap}
.ov-steps-head h2{margin:0;font:800 2rem var(--font-display);letter-spacing:-.02em}
.ov-steps-head .kicker{order:-1;width:100%;margin-bottom:6px}
.ov-steps-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:krok}
.ov-step{position:relative;padding:24px 24px 24px 76px;border-radius:var(--r-card);background:var(--panel);border:1px solid var(--line);transition:transform .3s,border-color .3s}
.ov-step:hover{transform:translateY(-4px);border-color:var(--accent)}
.ov-step .n{position:absolute;left:24px;top:22px;width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:var(--accent);color:var(--ink);font:800 1rem var(--font-display)}
.ov-step b{display:block;font-size:1.02rem;font-weight:700}
.ov-step p{margin:6px 0 0;color:var(--muted);font-size:.9rem}

/* komunita: art pás s Discordem a hlasováním */
.ov-community{position:relative;overflow:hidden;padding:88px var(--gx);border-top:1px solid var(--line);min-height:320px;display:flex;align-items:center}
.ov-community img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%;opacity:.35}
.ov-community .shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,7,10,.92) 0%,rgba(7,7,10,.7) 55%,rgba(7,7,10,.35) 100%)}
.ov-community .inner{position:relative;max-width:560px}
.ov-community h2{margin:10px 0 0;font:800 2.2rem var(--font-display);letter-spacing:-.02em}
.ov-community p{margin:14px 0 0;color:var(--fg2);font-size:1.02rem}
.ov-community-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.ov-community .btn-outline{padding:12px 22px;font-size:.9rem}

@media (max-width:960px){
  .ov-steps-grid{grid-template-columns:1fr}
}
@media (max-width:720px){
  .ov-steps{padding:48px var(--gx)}
  .ov-steps-head h2{font-size:1.7rem}
  .ov-community{padding:64px var(--gx);min-height:0}
  .ov-community h2{font-size:1.8rem}
  .ov-community .shade{background:linear-gradient(180deg,rgba(7,7,10,.85),rgba(7,7,10,.75))}
  .ov-community-actions .btn{width:100%}
}
@media (prefers-reduced-motion: reduce){
  .poster.is-skeleton{animation:none}
  .ov-step:hover{transform:none}
}
