/* ---------- Матч ---------- */
.mt-hero { margin-top: 22px; position: relative; overflow: hidden; border-radius: 12px; padding: 0; }
.mt-hero-art { position: absolute; top: 0; right: 0; height: 274px; width: 64%; background: center / cover no-repeat; }
.mt-hero-art::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .92) 14%, rgba(255, 255, 255, .25) 48%, rgba(255, 255, 255, .1) 100%); }
.mt-hero-in { position: relative; z-index: 2; height: 274px; padding: 14px 0 0 18px; }
.mt-game { display: flex; align-items: center; gap: 5px; font: 400 19px/1 var(--fd); color: var(--o); }
.mt-sub { margin-top: 10px; font-size: 18px; color: #4f5663; }
.mt-sub a { color: #4f5663; } .mt-sub a:hover { color: var(--o); }
.mt-sub i { font-style: normal; margin: 0 8px; color: #8b919c; }
.mt-vs { display: flex; align-items: flex-start; gap: 18px; margin-top: 18px; }
.mt-tn { min-width: 150px; }
.mt-tl:nth-of-type(2) { margin-left: 20px; }
.mt-tl { padding-top: 6px; }
.mt-tl .tl { background: transparent; }
.mt-tn > div, .mt-tn2 { display: flex; align-items: center; gap: 12px; }
.mt-tn a, .mt-tn2 a { font: 800 27px/1.2 var(--ff); color: var(--ink); text-transform: uppercase; letter-spacing: .3px; white-space: nowrap; }
.mt-tn .pl, .mt-tn2 .pl { height: 22px; min-width: 42px; font-size: 13px; }
.mt-tn2 { flex-direction: column; align-items: flex-start !important; gap: 8px !important; padding-top: 4px; }
.mt-tn b { display: block; margin-top: 2px; font: 800 62px/1 var(--ff); }
.mt-tn b.w { color: var(--o); } .mt-tn b.l { color: #4a5160; }
.mt-tn.r { padding-top: 38px; } .mt-tn.r b { text-align: left; }
.mt-colon { padding-top: 46px; margin: 0 26px; font: 800 44px/1 var(--ff); color: #4a5160; text-align: center; }
.mt-mapl { display: flex; align-items: center; gap: 10px; margin: 18px 0 0 296px; font-size: 18px; color: #4f5663; }
.mt-mapl svg { color: #4f5663; }
.mt-mapl i { font-style: normal; color: #8b919c; font-size: 14px; }
.mt-delta { position: absolute; z-index: 2; right: 26px; top: 122px; width: 305px; height: 107px; display: grid; grid-template-columns: 1fr 1fr; background: rgba(255, 255, 255, .92); border: 1px solid #edf0f3; border-radius: 10px; box-shadow: 0 4px 18px rgba(17, 24, 39, .1); }
.mt-delta > div { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.mt-delta > div + div { border-left: 1px solid #eef0f3; }
.mt-delta b { font-size: 28px; font-weight: 700; } .mt-delta b.p { color: #2a9a4f; } .mt-delta b.m { color: var(--red); }
.mt-delta small { font-size: 14px; color: #6b7280; line-height: 18px; margin-top: 4px; }
.mt-steps { position: relative; z-index: 2; height: 64px; display: flex; align-items: center; justify-content: space-between; padding: 0 40px 0 36px; border-top: 1px solid #eef0f3; background: #fff; }
.mt-step { display: inline-flex; align-items: center; gap: 14px; font-size: 18px; color: #4f5663; white-space: nowrap; }
.mt-step em { width: 35px; height: 35px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-style: normal; font-weight: 700; font-size: 16px; color: #8b919c; background: #eef0f3; }
.mt-step.done em, .mt-step.cur em { background: linear-gradient(180deg, #ff6c1d, #f55309); color: #fff; }
.mt-arr { flex: 1; height: 1px; margin: 0 14px; background: #d6dae0; position: relative; max-width: 120px; }
.mt-arr.on { background: var(--o); }
.mt-arr::after { content: ''; position: absolute; right: -1px; top: -4px; border: 4.5px solid transparent; border-left: 7px solid currentColor; color: #d6dae0; border-right: 0; }
.mt-arr.on::after { color: var(--o); }
.mt-grid { display: grid; grid-template-columns: 1fr 298px; gap: 30px; margin-top: 16px; align-items: start; }
.mt-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.mt-card { padding: 16px 14px 16px; }
.mt-h { display: flex; align-items: center; gap: 14px; padding: 0 2px 14px; }
.mt-h > svg { color: var(--o); }
.mt-h h3 { margin: 0 !important; font: 600 21px var(--ff) !important; color: var(--ink); text-transform: none !important; }
.mt-h .more { margin-left: auto; border: 0; background: none; cursor: pointer; }
.mt-h .more + .more { margin-left: 16px; }
.mt-turn { margin-left: auto; padding: 6px 12px; border-radius: 6px; background: #eef4ff; color: #2b6cd8; font-size: 14px; font-weight: 600; }
.mt-turn.me { background: var(--o-soft); color: var(--o); }
.mt-veto { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; }
.mt-veto:has(> :nth-child(7)) { grid-template-columns: repeat(7, 1fr); gap: 12px; }
.mt-map { display: flex; flex-direction: column; padding: 6px 6px 10px; border: 1px solid #e6e9ee; border-radius: 8px; background: #fff; text-align: left; cursor: default; font: inherit; }
.mt-map.can { cursor: pointer; border-color: #f6b08a; }
.mt-map.can:hover { box-shadow: 0 4px 14px rgba(251, 90, 14, .18); }
.mt-map-img { position: relative; height: 80px; border-radius: 5px; background: #2a2f38 center / cover; }
.mt-map.ban .mt-map-img { filter: grayscale(.85) brightness(.85); }
.mt-map-img i { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; border-radius: 50%; background: rgba(255, 255, 255, .85); color: #4a5160; display: flex; align-items: center; justify-content: center; }
.mt-map b { margin: 10px 0 0 2px; font-size: 17px; font-weight: 600; color: var(--ink); }
.mt-map em { margin-top: 8px; height: 30px; border-radius: 5px; display: flex; align-items: center; justify-content: center; gap: 8px; font-style: normal; font-size: 14px; }
.mt-map em.ok { background: #7fd48f; color: #fff; }
.mt-map em.no { border: 1px solid #f4b9b6; color: var(--red); background: #fff7f6; }
.mt-map em.go { background: var(--o); color: #fff; }
.mt-map em.wait { color: #9aa0aa; background: #f4f5f8; }
.mt-srv { display: flex; align-items: center; gap: 14px; }
.mt-srv-a { display: flex; align-items: center; gap: 16px; height: 72px; padding: 0 22px 0 16px; border: 1px solid #e6e9ee; border-radius: 8px; min-width: 330px; }
.mt-srv-a svg { color: #4a5160; }
.mt-srv-a b { display: block; font-size: 18px; font-weight: 600; color: var(--ink); }
.mt-srv-a small { display: flex; align-items: center; gap: 6px; font-size: 13px; color: #6b7280; margin-top: 4px; }
.mt-srv .xbtn { height: 52px; font-size: 15px; padding: 0 22px; gap: 12px; }
.mt-ac { display: flex; align-items: center; gap: 14px; height: 60px; padding: 0 18px; border-radius: 8px; background: #effaf1; border: 1px solid #cdeed5; color: #2a9a4f; }
.mt-ac b { display: block; font-size: 15px; font-weight: 600; color: #2a9a4f; }
.mt-ac small { font-size: 13px; color: #6b7280; }
.mt-team { position: relative; padding: 14px 14px 8px; overflow: visible; }
.mt-badge { position: absolute; top: -9px; left: 0; height: 22px; padding: 0 10px; border-radius: 5px; display: inline-flex; align-items: center; font-size: 13px; font-weight: 700; color: #fff; }
.mt-badge.w { background: #2fa85a; } .mt-badge.l { background: #3c84f2; }
.mt-team-h { display: flex; align-items: center; gap: 22px; padding: 8px 14px 10px 18px; }
.mt-team-h .tl { background: transparent; }
.mt-team-h a { font: 800 25px var(--ff); color: var(--ink); text-transform: uppercase; }
.mt-team-h .pl { height: 24px; min-width: 46px; }
.mt-team-h > b { margin-left: auto; font: 800 40px var(--ff); color: var(--ink); }
.mt-st { width: 100%; border-collapse: collapse; }
.mt-st th { height: 34px; font-size: 14px; font-weight: 400; color: #6b7280; text-align: center; padding: 0 6px; border-bottom: 1px solid #eef0f3; }
.mt-st th:nth-child(2) { text-align: left; }
.mt-st td { height: 44px; font-size: 15px; text-align: center; color: var(--ink); border-bottom: 1px solid #f0f2f5; padding: 0 6px; }
.mt-st tr:last-child td { border-bottom: 0; }
.mt-st td:nth-child(2) { text-align: left; }
.mt-st .p { color: #2a9a4f; } .mt-st .m { color: var(--red); } .mt-st .b { font-weight: 600; }
.mt-pl { display: inline-flex; align-items: center; gap: 12px; color: var(--ink); }
.mt-mvp { display: inline-flex; align-items: center; gap: 6px; } .mt-mvp svg { color: var(--o); }
.mt-roster { display: flex; flex-wrap: wrap; gap: 10px; padding: 6px 12px 10px; }
.mt-roster a { display: inline-flex; align-items: center; gap: 10px; padding: 6px 12px 6px 6px; border: 1px solid #edf0f3; border-radius: 8px; color: var(--ink); }
.mt-roster i { font-style: normal; font-size: 12px; font-weight: 700; padding: 2px 6px; border-radius: 4px; background: #eef0f4; }
.mt-disp { padding: 10px 4px; border-top: 1px solid #f0f2f5; }
.mt-disp > div { display: flex; align-items: center; gap: 10px; }
.mt-disp small { color: #8b919c; }
.mt-side { display: flex; flex-direction: column; gap: 12px; padding: 12px; background: rgba(255, 255, 255, .6); border-radius: 12px; }
.mt-link { display: flex; align-items: center; gap: 16px; height: 78px; padding: 0 14px; color: var(--ink); cursor: pointer; }
.mt-link > svg:first-child { width: 46px; height: 46px; padding: 10px; border-radius: 8px; background: linear-gradient(180deg, #ff6c1d, #f55309); color: #fff; flex-shrink: 0; }
.mt-link span { flex: 1; }
.mt-link b { display: block; font-size: 16px; font-weight: 600; }
.mt-link small { font-size: 13px; color: #6b7280; }
.mt-link > svg:last-child { color: #6b7280; }
.mt-link:hover { color: var(--ink); border-color: #f3c3ad; }
.mt-chat { padding: 10px; }
.mt-action .card { border: 0; box-shadow: none; }