/* Резултати во живо — цел екран, темно */
@font-face{font-family:'Russo One';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/russo-one-cyrillic-400-normal.woff2) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Russo One';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/russo-one-latin-400-normal.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122,U+2212}
:root{--disp:'Russo One','Roboto Condensed',sans-serif;--rbg:#0B0C0D;--rp:#121316;--rp2:#181A1E;--rl:#23262B;--top:60px}
html,body.room{height:100%;background:var(--rbg)}
.room [hidden]{display:none!important}
body.room{overflow-x:hidden}
body.room{overflow:hidden;display:flex;flex-direction:column}
.room button{border-radius:2px}
.num{font-variant-numeric:tabular-nums}
.acc{color:var(--acc)}.ok{color:#4ADE80;font-style:normal}.bad{color:#FF7A6E;font-style:normal}.dim{color:var(--dim)}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#FF5A4E;animation:rbl 1.4s infinite}
@keyframes rbl{50%{opacity:.25}}
@media (prefers-reduced-motion:reduce){.dot,.pill-live i{animation:none}}
body.offline .rtop{box-shadow:inset 0 -3px 0 #E5483C}

/* горна лента */
.rtop{flex:none;height:var(--top);display:flex;align-items:center;gap:16px;padding:0 16px;background:#08090A;border-bottom:3px solid var(--acc)}
.rbrand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;min-width:0;flex:0 1 auto}
.rbrand b{flex:none;width:36px;height:36px;background:var(--acc);color:#111;font:400 16px var(--disp);display:flex;align-items:center;justify-content:center}
.rbrand > span{display:flex;flex-direction:column;min-width:0}
#rname{font:400 16px/1.1 var(--disp);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#rsub{color:var(--mut);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rstages{display:flex;gap:4px}
.rstages:empty{display:none}
.rstages button,.rbtns button{height:34px;padding:0 12px;font:400 12px var(--disp);text-transform:uppercase;letter-spacing:.04em;background:var(--rp2);border:1px solid var(--rl);color:#C9CDD2}
.rstages button.on,.rbtns button.on{background:var(--acc);border-color:var(--acc);color:#111}
[class^=pill-]{display:inline-flex;align-items:center;gap:7px;font:400 12px var(--disp);text-transform:uppercase;letter-spacing:.06em;padding:6px 10px;white-space:nowrap}
.pill-live{background:#3A1614;color:#FF8A80}.pill-live i{width:8px;height:8px;border-radius:50%;background:#FF5A4E;animation:rbl 1.4s infinite}
.pill-ok{background:#173320;color:#6EDB9A}.pill-warn{background:#3A2E12;color:#F5B83D}.pill-wait{background:#162A3B;color:#7DB8FF}
.rmid{margin-left:auto;text-align:right;line-height:1.1}
.rclock{font:400 24px var(--disp);color:#fff}
.rnext{font-size:12px;color:var(--mut);white-space:nowrap}
.rnext b{color:#fff;font-weight:700}
.rbtns{display:flex;gap:6px}
.rflag{flex:none;background:#E5483C;color:#fff;font:400 16px var(--disp);text-transform:uppercase;text-align:center;padding:10px;letter-spacing:.04em}

/* главен дел: мапа + страничен панел */
.rmain{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 440px}
.rmapcol{position:relative;min-width:0;min-height:0;display:flex;flex-direction:column;background:#050506}
.rmap{flex:1;min-height:0}
.rmap .maplibregl-ctrl-bottom-left{bottom:auto;top:8px}
.rprof{flex:none;background:#0E0F11;border-top:1px solid var(--rl);padding:4px 10px 2px}
.rprof .empty{padding:8px;font-size:12px}
.roc{position:absolute;left:12px;right:12px;bottom:108px;display:flex;gap:8px;overflow-x:auto;pointer-events:none;scrollbar-width:none}
.roc::-webkit-scrollbar{display:none}
.occ{pointer-events:auto;flex:0 0 230px;display:flex;flex-direction:column;gap:7px;padding:10px 12px;height:auto;background:rgba(10,11,12,.86);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.1);text-align:left;color:#fff;font:inherit;cursor:pointer;white-space:normal;align-items:stretch}
.occ:hover{background:rgba(20,21,24,.95)}
.occ.on{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc)}
.occ-h{display:flex;align-items:center;gap:8px}
.occ-h b{flex:1;min-width:0;font:400 14px var(--disp);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.occ-h .num{font:600 18px 'Roboto Condensed',sans-serif}
.occ-bar{height:4px;background:#2A2D31;display:block}
.occ-bar i{display:block;height:100%;background:var(--acc);transition:width .6s}
.occ-f{display:flex;gap:10px;font-size:12px;color:#A3A8AE;white-space:nowrap;overflow:hidden}
.occ-f em{font-weight:700}
.occ.big{flex:none;width:100%;margin-bottom:8px;background:var(--rp2)}
.occ.big .occ-h .num{font-size:22px}
.rpip{position:absolute;top:12px;right:12px;width:min(42%,480px);aspect-ratio:16/9;background:#000;border:1px solid rgba(255,255,255,.15);box-shadow:0 10px 30px rgba(0,0,0,.5);z-index:3}
.rpipin,.rpipin iframe{width:100%;height:100%;border:0;display:block}
.rpip button{position:absolute;top:6px;right:6px;width:30px;height:30px;padding:0;background:rgba(0,0,0,.7);border:none;color:#fff}

.rside{min-height:0;display:flex;flex-direction:column;background:var(--rp);border-left:1px solid var(--rl)}
.rtabs{flex:none;display:flex;border-bottom:1px solid var(--rl);overflow-x:auto;scrollbar-width:none}
.rtabs::-webkit-scrollbar{display:none}
.rtabs button{flex:1 0 auto;white-space:nowrap;height:48px;border:none;border-bottom:3px solid transparent;background:none;color:#A3A8AE;font:400 13px var(--disp);text-transform:uppercase;letter-spacing:.04em;padding:0 8px}
.rtabs button.on{color:#fff;border-bottom-color:var(--acc)}
.rtabs button b{background:var(--acc);color:#111;padding:1px 6px;font:700 11px Inter,sans-serif;margin-left:4px}
.rtabs button b:empty{display:none}
.rcats{flex:none;display:flex;gap:6px;padding:10px 12px;border-bottom:1px solid var(--rl);overflow-x:auto;scrollbar-width:none}
.rcats[hidden]{display:none}
.rcats button{flex:none;height:30px;padding:0 12px;background:var(--rp2);border:1px solid var(--rl);color:#C9CDD2;font:400 12px var(--disp)}
.rcats button.on{background:#fff;border-color:#fff;color:#111}
.rlist{flex:1;min-height:0;overflow-y:auto;padding:4px 0}
.rhead,.rrow{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:10px;align-items:center;padding:0 14px}
.rhead{height:30px;color:var(--dim);font-size:11px;text-transform:uppercase;letter-spacing:.06em}
.rhead span:last-child{text-align:right}
.rrow{min-height:56px;border-top:1px solid #1C1E22}
.rrow.on{background:#1C140D;cursor:pointer}
.rrow.on:hover{background:#26190F}
.rrow.fresh{animation:rfresh 2.5s ease-out;background:#13241A}
@keyframes rfresh{0%{background:#2F6B45}100%{background:#13241A}}
.rrow.out{opacity:.55}
.rpos{font:400 20px var(--disp);color:#C9CDD2;text-align:center}
.rpos.p1{color:var(--acc)}.rpos.p2,.rpos.p3{color:#fff}
.rwho{display:flex;align-items:center;gap:10px;min-width:0}
.rwho > span:last-child{min-width:0;display:flex;flex-direction:column}
.rwho b{font:400 15px/1.2 var(--disp);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rwho .ini{color:#A3A8AE}
.rwho small{font-size:12px;color:#8A9097;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bno{flex:none;min-width:34px;height:26px;padding:0 5px;display:inline-flex;align-items:center;justify-content:center;background:#fff;color:#111;font:400 14px var(--disp);box-shadow:inset 0 -3px 0 var(--c,#F26B1D)}
.rtime{text-align:right;display:flex;flex-direction:column;align-items:flex-end}
.rtime b{font:700 18px 'Roboto Condensed',sans-serif;color:#fff}
.rtime b.acc{color:var(--acc)}
.rtime small{font:500 12px 'Roboto Condensed',sans-serif;color:#8A9097}
.rfoot{flex:none;padding:10px 14px;border-top:1px solid var(--rl);color:var(--mut);font-size:12px}
.rfoot:empty{display:none}
.rempty{padding:40px 20px;text-align:center;color:var(--mut)}
.rvid{position:relative;aspect-ratio:16/9;background:#000;margin:12px}
.rvid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* известувања за финиш */
.rtoasts{position:fixed;top:calc(var(--top) + 12px);left:50%;transform:translateX(-50%);z-index:20;display:flex;flex-direction:column;gap:8px;width:min(560px,calc(100vw - 24px));pointer-events:none}
.rtoast{display:flex;align-items:center;gap:10px;background:#fff;color:#111;padding:10px 14px;box-shadow:0 12px 30px rgba(0,0,0,.45);border-left:5px solid #2FBF71;animation:rin .35s ease-out;transition:opacity .5s,transform .5s}
.rtoast.out{opacity:0;transform:translateY(-8px)}
.rtoast b{font:400 15px var(--disp);flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rtoast .ini{color:#6B7077}
.rtoast .num{font:700 18px 'Roboto Condensed',sans-serif}
.rt-tag{background:#2FBF71;color:#06210F;font:400 11px var(--disp);text-transform:uppercase;padding:4px 7px}
.rt-pos{font-size:12px;color:#555;white-space:nowrap}
@keyframes rin{from{opacity:0;transform:translateY(-10px)}}

/* таблет */
@media (max-width:1200px){.rmain{grid-template-columns:minmax(0,1fr) 380px}.occ{flex-basis:200px}}
/* телефон: мапата горе, јазичиња долу, страницата скрола */
@media (max-width:900px){
  :root{--top:56px}
  body.room{overflow:auto;height:auto;min-height:100%}
  .rtop{position:sticky;top:0;z-index:10;gap:10px;padding:0 12px;padding-top:env(safe-area-inset-top);height:calc(var(--top) + env(safe-area-inset-top))}
  #rstat,.rstages,#rsub{display:none}
  .rclock{font-size:18px}
  .rnext{font-size:11px;max-width:44vw;overflow:hidden;text-overflow:ellipsis}
  .rbtns button{height:32px;padding:0 9px}
  #bfs{display:none}
  .rmain{display:block}
  .rmapcol{height:42vh;min-height:260px;position:sticky;top:calc(var(--top) + env(safe-area-inset-top));z-index:5}
  .rprof,.roc,.rpip{display:none}
  .rside{border-left:none;min-height:58vh}
  .rtabs{position:sticky;top:calc(var(--top) + env(safe-area-inset-top) + max(42vh,260px));z-index:4;background:var(--rp)}
  .rlist{overflow:visible;padding-bottom:env(safe-area-inset-bottom)}
  .rrow{min-height:60px}
  .occ.big{margin:8px 12px;width:calc(100% - 24px)}
  .rtoasts{top:calc(var(--top) + 8px)}
}
@media (max-width:900px) and (max-height:560px){.rmapcol{height:52vh;min-height:0;position:relative;top:0}.rtabs{position:static}}
@media (min-width:901px){.rtoasts{left:calc((100vw - 440px) / 2)}}
@media (min-width:901px) and (max-width:1200px){.rtoasts{left:calc((100vw - 380px) / 2)}}

/* видео во живо */
.vseg{position:absolute;top:12px;left:12px;z-index:6;display:flex;box-shadow:0 6px 20px rgba(0,0,0,.4)}
.vseg button{height:38px;padding:0 14px;display:inline-flex;align-items:center;gap:8px;background:rgba(10,11,12,.9);border:1px solid rgba(255,255,255,.14);color:#C9CDD2;font:400 13px var(--disp);text-transform:uppercase;letter-spacing:.04em}
.vseg button + button{border-left:none}
.vseg button.on{background:var(--acc);border-color:var(--acc);color:#111}
.vseg button.on .dot{background:#111;animation:none}
.rmap .maplibregl-ctrl-bottom-left{top:58px}
.rmainvid{position:absolute;left:0;right:0;top:0;bottom:104px;z-index:4;background:#000}
.rmainvid iframe,.rsvid iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
body.vmain .roc{z-index:5}
.rsvid{position:relative;flex:none;aspect-ratio:16/9;background:#000;border-bottom:1px solid var(--rl)}
/* пријатели: лента долу на страницата */
.rspons{flex:none;display:flex;align-items:center;gap:18px;height:72px;padding:0 16px;background:#08090A;border-top:1px solid var(--rl)}
.rsp-t{flex:none;font:400 12px var(--disp);color:var(--acc);text-transform:uppercase;letter-spacing:.1em}
.rsp-win{flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.rsp-track{display:flex;gap:10px;width:max-content}
.rsp-track.run{animation:rsp linear infinite}
.rsp-win:hover .rsp-track{animation-play-state:paused}
@keyframes rsp{to{transform:translateX(calc(-50% - 5px))}}
@media (prefers-reduced-motion:reduce){.rsp-track.run{animation:none}.rsp-win{overflow-x:auto}}
.rsp-track a,.rsp-track span{flex:none;width:140px;height:52px;background:#fff;display:flex;align-items:center;justify-content:center;padding:6px 12px}
.rsp-track img{max-width:100%;max-height:40px;object-fit:contain}
@media (max-width:900px){
  .rmainvid{bottom:0}
  .rsvid{display:none}
  .vseg{top:10px;left:10px}
  .vseg button{height:34px;padding:0 10px;font-size:12px}
  .rspons{flex-direction:column;align-items:stretch;gap:10px;height:auto;padding:16px 0 calc(16px + env(safe-area-inset-bottom))}
  .rsp-t{padding:0 16px}
  .rsp-track a,.rsp-track span{width:120px;height:48px}
}

.rlogo{flex:none;height:38px;width:auto;max-width:120px;object-fit:contain}

/* пред трката: одбројување врз мапата */
.rpre{position:absolute;inset:0;bottom:104px;z-index:3;display:flex;align-items:flex-end;justify-content:flex-start;padding:28px;pointer-events:none;
  background:linear-gradient(0deg,rgba(5,5,6,.92) 0,rgba(5,5,6,.55) 38%,rgba(5,5,6,0) 70%)}
.rpre-in{pointer-events:auto;max-width:860px;display:flex;flex-direction:column;gap:16px}
.rpre-eye{display:flex;align-items:center;gap:10px;color:#fff;font:400 13px var(--disp);text-transform:uppercase;letter-spacing:.1em;text-shadow:0 1px 8px rgba(0,0,0,.6)}
.rpre-eye .dot{background:var(--acc)}
.rpre-name{margin:0;font:400 clamp(30px,4.2vw,58px)/1 var(--disp);text-transform:uppercase;color:#fff;letter-spacing:.01em;text-shadow:0 2px 20px rgba(0,0,0,.5)}
.rpre-cd{display:flex;gap:8px}
.rpre-cd > div{min-width:96px;padding:12px 14px 10px;background:rgba(10,11,12,.82);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12);border-top:3px solid var(--acc);display:flex;flex-direction:column;align-items:center;gap:4px}
.rpre-cd b{font:400 clamp(34px,4vw,56px)/1 var(--disp);color:#fff}
.rpre-cd span{font:400 11px var(--disp);color:#A3A8AE;text-transform:uppercase;letter-spacing:.12em}
.rpre-cd.last > div{min-width:120px}
.rpre-cd.last b{font-size:clamp(44px,5.4vw,76px);color:var(--acc)}
.rpre-soon{display:flex;align-items:center;gap:12px;padding:14px 20px;background:var(--acc);color:#111;font:400 26px var(--disp);text-transform:uppercase}
.rpre-soon .dot{background:#111}
.rpre-stats{display:flex;flex-wrap:wrap;gap:0;border-top:1px solid rgba(255,255,255,.14);padding-top:14px}
.rpre-stats > div{display:flex;flex-direction:column;gap:2px;padding:0 22px;border-left:1px solid rgba(255,255,255,.14)}
.rpre-stats > div:first-child{padding-left:0;border-left:0}
.rpre-stats b{font:400 24px var(--disp);color:#fff}
.rpre-stats > div:first-child b{color:var(--acc)}
.rpre-stats span{font-size:12px;color:#A3A8AE}
.rpre-btns{display:flex;flex-wrap:wrap;gap:8px}
.rpre-b{height:46px;padding:0 20px;display:inline-flex;align-items:center;gap:10px;background:rgba(10,11,12,.85);border:1px solid rgba(255,255,255,.2);color:#fff;font:400 14px var(--disp);text-transform:uppercase;letter-spacing:.05em;text-decoration:none;cursor:pointer}
.rpre-b:hover{border-color:#fff}
.rpre-b.p{background:var(--acc);border-color:var(--acc);color:#111}
.rpre-b.p .dot{background:#111}
body.pre .rnext,body.pre .roc{display:none}
body.pre .rspons{height:96px}
body.pre .rsp-t{font-size:13px}
body.pre .rsp-track a,body.pre .rsp-track span{width:170px;height:68px}
body.pre .rsp-track img{max-height:52px}
.rlist.flash,.rtabs.flash{animation:rflash 1.2s}
@keyframes rflash{0%{box-shadow:inset 0 0 0 2px var(--acc)}100%{box-shadow:inset 0 0 0 2px transparent}}
@media (max-width:1200px){.rpre{padding:20px}.rpre-cd > div{min-width:80px}}
@media (max-width:900px){
  body.pre .rmapcol{position:relative;top:0;height:auto;min-height:0}
  body.pre .rmap{flex:none;height:34vh;min-height:220px}
  body.pre .rtabs{position:static}
  .rpre{position:relative;inset:auto;bottom:auto;padding:18px 14px 20px;background:#050506;border-top:1px solid var(--rl)}
  .rpre-in{gap:12px;width:100%}
  .rpre-eye{font-size:11px;letter-spacing:.06em;align-items:flex-start}
  .rpre-eye .dot{margin-top:3px;flex:none}
  .rpre-name{font-size:28px}
  .rpre-cd{gap:6px}
  .rpre-cd > div,.rpre-cd.last > div{flex:1;min-width:0;padding:10px 4px 8px}
  .rpre-cd b{font-size:30px}.rpre-cd.last b{font-size:38px}
  .rpre-cd span{font-size:10px;letter-spacing:.06em}
  .rpre-stats{display:grid;grid-template-columns:1fr 1fr;gap:12px 0}
  .rpre-stats > div{padding:0 12px}
  .rpre-stats > div:nth-child(odd){padding-left:0;border-left:0}
  .rpre-stats b{font-size:20px}
  .rpre-btns{display:grid;grid-template-columns:1fr 1fr}
  .rpre-b{justify-content:center;padding:0 10px;font-size:13px}
  .rpre-b.p{grid-column:1/-1}
  body.pre .rspons{height:auto}
  body.pre .rsp-track a,body.pre .rsp-track span{width:140px;height:56px}
}
@media (max-width:900px){#bcd span{display:none}}

.rcredit{flex:none;padding:8px 14px calc(8px + env(safe-area-inset-bottom));border-top:1px solid var(--rl);text-align:right}
@media (max-width:900px){.rcredit{text-align:center}}