/* Топ-блоки главной (модуль top_blocks). Все классы с префиксом tb-, чтобы не пересекаться со стилями темы. */
.tb-root,.tb-root *{box-sizing:border-box}
.tb-root{container-type:inline-size;position:relative;display:flex;flex-direction:column;gap:14px;margin:0 0 24px;font-family:'Montserrat',system-ui,sans-serif}
.tb-head{color:#fff;text-align:center;margin:4px 0 2px}
.tb-title{font-size:15px;font-weight:700}
.tb-sub{font-size:12px;color:#8a8fa7;font-weight:600;line-height:1.4}

.tb-card{position:relative;overflow:hidden;width:100%;border-radius:18px;padding:16px 46px 16px 16px;color:#fff;display:flex;flex-direction:row;align-items:center;gap:16px;border:1px solid rgba(255,255,255,.08);background:linear-gradient(1deg,#222 30%,#2d2d2d 100%);text-align:left;font:inherit;margin:0;animation:tb-rise .55s cubic-bezier(.2,.8,.2,1) both}
.tb-good{background:radial-gradient(ellipse 55% 140% at 0% 50%,hsl(120 70% 42% / .14),transparent 72%),linear-gradient(1deg,#222 30%,#2d2d2d 100%);border-color:hsl(120 55% 45% / .30);animation:tb-rise .55s cubic-bezier(.2,.8,.2,1) both,tb-breathe 4.5s ease-in-out infinite}
.tb-badc{background:radial-gradient(ellipse 55% 140% at 0% 50%,hsl(0 75% 48% / .17),transparent 72%),linear-gradient(1deg,#222 30%,#2d2d2d 100%);border-color:hsl(0 65% 50% / .34);animation:tb-rise .55s cubic-bezier(.2,.8,.2,1) both,tb-breatheR 3s ease-in-out infinite}
.tb-go{cursor:pointer;transition:transform .2s ease,border-color .2s ease}
.tb-go:hover,.tb-go:focus-visible{transform:translateY(-3px);border-color:hsl(120 60% 50% / .65);outline:none}
.tb-go::after,.tb-badc::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:28%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.09),transparent);transform:skewX(-20deg);animation:tb-sweep 7s ease-in-out infinite;pointer-events:none}
.tb-badc::after{animation-duration:9s;background:linear-gradient(100deg,transparent,rgba(255,120,110,.09),transparent)}
.tb-arrow{position:absolute;top:50%;margin-top:-13px;right:11px;width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;transition:background .2s,transform .2s}
.tb-go:hover .tb-arrow{background:hsl(120 65% 48%);transform:translateX(3px)}
.tb-go:hover .tb-arrow svg{stroke:#0b1a0d}
.tb-hd{display:flex;align-items:center;gap:10px;position:relative;flex-wrap:wrap}
.tb-lbl{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#a3a8bd;font-weight:800;white-space:nowrap}
.tb-nick{font-size:20px;font-weight:700;position:relative;letter-spacing:.02em;color:#fff;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-bigbox{position:relative;flex:0 0 auto;max-width:100%}
.tb-big{font-size:46px;font-weight:800;line-height:1;letter-spacing:-.025em;position:relative;white-space:nowrap;animation:tb-glow 3.2s ease-in-out infinite}
.tb-big.tb-red{animation:tb-beat 2.4s ease-in-out infinite;transform-origin:left center}
.tb-unit{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#8a8fa7;font-weight:700;margin-top:4px}
.tb-left{display:flex;flex-direction:column;gap:6px;position:relative;flex:0 0 166px;min-width:0}
.tb-chips{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;position:relative;flex:1 1 0;min-width:0}
.tb-chip{background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.06);border-radius:12px;padding:8px 10px;min-width:0}
.tb-cv{font-size:14px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-cl{font-size:8.5px;letter-spacing:.07em;text-transform:uppercase;color:#8a8fa7;font-weight:600;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-meter{position:relative;height:4px;border-radius:9px;margin-top:6px;background:linear-gradient(90deg,hsl(0 80% 55%),hsl(30 85% 55%),hsl(60 80% 52%),hsl(90 70% 50%),hsl(120 70% 48%));overflow:hidden}
.tb-meter i{position:absolute;top:0;bottom:0;right:0;background:#3a3c45}
.tb-side{position:relative;display:flex;flex-direction:column;gap:8px;flex:0 0 138px;min-width:0}
.tb-srow{font-size:12px;font-weight:700;display:flex;justify-content:space-between;gap:8px;color:#fff}
.tb-srow span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.tb-srow span+span{color:#b4bac8;white-space:nowrap}
.tb-pill{font-size:10px;font-weight:800;letter-spacing:.08em;padding:3px 8px;border-radius:99px;color:#0b1a0d;background:hsl(120 65% 50%);animation:tb-pillglow 2.8s ease-in-out infinite}

@keyframes tb-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes tb-sweep{0%,62%{left:-40%}100%{left:135%}}
@keyframes tb-breathe{0%,100%{box-shadow:0 0 0 hsl(120 70% 45% / 0)}50%{box-shadow:0 0 24px hsl(120 70% 45% / .20)}}
@keyframes tb-breatheR{0%,100%{box-shadow:0 0 0 hsl(0 80% 50% / 0)}50%{box-shadow:0 0 24px hsl(0 80% 50% / .24)}}
@keyframes tb-glow{0%,100%{filter:drop-shadow(0 0 0 transparent)}50%{filter:drop-shadow(0 0 12px currentColor)}}
@keyframes tb-beat{0%,60%,100%{transform:scale(1)}68%{transform:scale(1.06)}76%{transform:scale(1)}84%{transform:scale(1.04)}}
@keyframes tb-pillglow{0%,100%{box-shadow:0 0 0 hsl(120 70% 50% / 0)}50%{box-shadow:0 0 12px hsl(120 70% 50% / .7)}}
@media (prefers-reduced-motion:reduce){.tb-root *,.tb-root *::after{animation:none!important;transition:none!important}}

@container (max-width:780px){
 .tb-card{flex-wrap:wrap;gap:14px;padding:16px}
 .tb-arrow{top:12px;margin-top:0;right:12px}
 .tb-left{flex:1 1 100%}
 .tb-chips{flex:1 1 100%}
 .tb-side{flex:1 1 100%;flex-direction:row;padding-right:0}
 .tb-side .tb-chip{flex:1 1 0}
}
@container (max-width:480px){
 .tb-chips{grid-template-columns:repeat(2,minmax(0,1fr))}
 .tb-side{flex-direction:column}
 .tb-big{font-size:40px}
}
