/*
 * Treason Grounds UI Modern v1.0.2
 * CSS-only Design Layer. Keine Änderung an Spiellogik, REST, Datenbank oder Shortcode-Flow.
 */

:root {
    --tg-modern-bg: #0f1115;
    --tg-modern-bg-deep: #07090d;
    --tg-modern-card: rgba(28, 31, 38, 0.86);
    --tg-modern-card-strong: rgba(31, 35, 43, 0.94);
    --tg-modern-line: rgba(154, 160, 166, 0.20);
    --tg-modern-line-soft: rgba(255, 255, 255, 0.08);
    --tg-modern-text: #ffffff;
    --tg-modern-muted: #9aa0a6;
    --tg-modern-primary: #ff7a00;
    --tg-modern-primary-2: #ff9d2e;
    --tg-modern-danger: #e53935;
    --tg-modern-success: #22c55e;
    --tg-modern-blue: #5aa7ff;
    --tg-modern-shadow: 0 22px 70px rgba(0, 0, 0, 0.45);
    --tg-modern-radius: 22px;
}

body.tg-virtual-app-page,
body:has(.tg-app-shell) {
    background:
        radial-gradient(circle at 50% -12%, rgba(255, 122, 0, 0.10), transparent 28%),
        radial-gradient(circle at 12% 18%, rgba(90, 167, 255, 0.08), transparent 24%),
        linear-gradient(180deg, #111821 0%, var(--tg-modern-bg) 42%, #07090d 100%) !important;
}

.tg-app-shell {
    max-width: 720px !important;
    min-height: 100svh !important;
    padding: 96px 16px 122px !important;
    color: var(--tg-modern-text) !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.035), transparent 170px),
        radial-gradient(circle at 50% 0%, rgba(255, 122, 0, .08), transparent 24%),
        linear-gradient(180deg, var(--tg-modern-bg) 0%, var(--tg-modern-bg-deep) 100%) !important;
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.tg-app-shell-nav {
    padding-top: 98px !important;
    padding-bottom: 124px !important;
}

.tg-app-shell * {
    -webkit-tap-highlight-color: transparent;
}

.tg-app-topbar {
    top: max(10px, env(safe-area-inset-top)) !important;
    width: min(calc(100% - 24px), 696px) !important;
    grid-template-columns: 58px 1fr 58px !important;
    padding: 10px !important;
    border: 1px solid rgba(255,255,255,.15) !important;
    border-bottom-color: rgba(255,122,0,.26) !important;
    border-radius: 22px !important;
    background:
        linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.018)),
        rgba(15, 17, 21, .66) !important;
    box-shadow: 0 16px 50px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.10) !important;
    backdrop-filter: blur(18px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
}

.tg-topbar-logo,
.tg-topbar-profile {
    width: 50px !important;
    height: 50px !important;
    border-radius: 17px !important;
    background:
        linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.025)) !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    color: rgba(255,255,255,.88) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

.tg-topbar-logo img {
    width: 32px !important;
    height: 32px !important;
    filter: drop-shadow(0 0 12px rgba(255, 122, 0, .20));
}

.tg-topbar-profile {
    position: relative;
}

.tg-topbar-profile::after {
    content: "";
    position: absolute;
    top: 8px;
    right: 8px;
    width: 10px;
    height: 10px;
    border-radius: 999px;
    background: var(--tg-modern-primary);
    box-shadow: 0 0 18px rgba(255,122,0,.8);
}

.tg-topbar-center {
    min-height: 50px !important;
    padding: 7px 10px !important;
    border: 0 !important;
    border-radius: 16px !important;
    background: transparent !important;
}

.tg-topbar-label {
    color: rgba(255,255,255,.58) !important;
    font-size: 10px !important;
    letter-spacing: .15em !important;
}

.tg-topbar-timer,
.tg-topbar-state {
    color: #fff !important;
    font-size: clamp(17px, 4.8vw, 26px) !important;
    font-weight: 850 !important;
    line-height: 1.05 !important;
    text-shadow: 0 0 18px rgba(255,122,0,.14) !important;
}

.tg-topbar-state-warning { color: var(--tg-modern-primary-2) !important; }
.tg-topbar-state-muted { color: rgba(255,255,255,.72) !important; }

.tg-app-hero,
.tg-app-card,
.tg-profile-card,
.tg-player-list-card,
.tg-home-mission-card,
.tg-home-offer-card,
.tg-message-card,
.tg-mission-card,
.tg-more-card,
.tg-saboteur-card,
.tg-vote-card,
.tg-score-reveal-card,
.tg-resource-card,
.tg-map-card,
.tg-push-card,
.tg-install-card,
.tg-app-news-hint,
.tg-app-warning,
.tg-app-success {
    position: relative;
    margin-bottom: 14px !important;
    padding: 18px !important;
    border: 1px solid var(--tg-modern-line) !important;
    border-radius: var(--tg-modern-radius) !important;
    background:
        linear-gradient(145deg, rgba(255,255,255,.058), rgba(255,255,255,.018)),
        var(--tg-modern-card) !important;
    box-shadow: 0 18px 48px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
    overflow: hidden;
}

.tg-app-hero::before,
.tg-app-card::before,
.tg-home-mission-card::before,
.tg-home-offer-card::before,
.tg-message-card::before,
.tg-app-news-hint::before,
.tg-app-warning::before,
.tg-app-success::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    background: linear-gradient(180deg, transparent, rgba(255,122,0,.88), transparent);
    opacity: .7;
}

.tg-app-hero {
    padding: 20px !important;
    background:
        linear-gradient(135deg, rgba(255,122,0,.10), transparent 42%),
        linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.02)),
        var(--tg-modern-card-strong) !important;
}

.tg-app-kicker,
.tg-app-shell h4,
.tg-home-section-title,
.tg-section-title {
    color: var(--tg-modern-muted) !important;
    font-weight: 850 !important;
    letter-spacing: .10em !important;
    text-transform: uppercase !important;
}

.tg-app-shell h2,
.tg-app-shell h3 {
    color: var(--tg-modern-text) !important;
    letter-spacing: -0.03em !important;
}

.tg-app-shell p,
.tg-app-shell li,
.tg-app-small {
    color: rgba(255,255,255,.76) !important;
}

.tg-app-muted p,
.tg-app-muted,
.tg-muted {
    color: var(--tg-modern-muted) !important;
}

.tg-app-button,
button.tg-app-button,
input.tg-app-button,
.tg-mini-button,
.tg-install-button,
.tg-push-button,
.tg-offer-action,
.tg-action-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 48px !important;
    padding: 13px 18px !important;
    color: #111 !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: linear-gradient(180deg, #ffb257 0%, var(--tg-modern-primary) 100%) !important;
    box-shadow: 0 10px 28px rgba(255,122,0,.28), inset 0 1px 0 rgba(255,255,255,.35) !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    text-align: center !important;
}

.tg-app-button-secondary,
.tg-mini-button-secondary,
.tg-app-button.tg-app-button-secondary {
    color: rgba(255,255,255,.88) !important;
    background: rgba(255,255,255,.075) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}

.tg-app-button:active,
.tg-mini-button:active,
.tg-nav-item:active {
    transform: translateY(1px) scale(.99);
}

.tg-rating-option,
.tg-player-list-item,
.tg-profile-grid div,
.tg-profile-note,
.tg-result-box,
.tg-mission-step,
.tg-mission-instruction-box,
.tg-news-item,
.tg-message-item,
.tg-more-list a,
.tg-more-list button {
    border: 1px solid rgba(255,255,255,.11) !important;
    border-radius: 17px !important;
    background: rgba(255,255,255,.045) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.tg-badge,
.tg-pill,
.tg-badge-news,
.tg-status-pill {
    border-radius: 999px !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    background: rgba(255,255,255,.09) !important;
    color: rgba(255,255,255,.88) !important;
    font-weight: 850 !important;
}

.tg-badge-news,
.tg-pill-active,
.tg-status-pill-active {
    background: rgba(255,122,0,.15) !important;
    color: var(--tg-modern-primary-2) !important;
    border-color: rgba(255,122,0,.34) !important;
}

.tg-app-news-hint,
.tg-player-list-item-has-news {
    border-color: rgba(255,122,0,.35) !important;
    background:
        linear-gradient(145deg, rgba(255,122,0,.12), rgba(255,255,255,.02)),
        var(--tg-modern-card) !important;
}

.tg-app-warning {
    border-color: rgba(229,57,53,.38) !important;
    background:
        linear-gradient(145deg, rgba(229,57,53,.13), rgba(255,255,255,.02)),
        var(--tg-modern-card) !important;
}

.tg-app-warning::before { background: linear-gradient(180deg, transparent, var(--tg-modern-danger), transparent); }

.tg-app-success {
    border-color: rgba(34,197,94,.34) !important;
    background:
        linear-gradient(145deg, rgba(34,197,94,.13), rgba(255,255,255,.02)),
        var(--tg-modern-card) !important;
}

.tg-app-success::before { background: linear-gradient(180deg, transparent, var(--tg-modern-success), transparent); }

.tg-score-layer-backdrop {
    background: rgba(3, 5, 8, 0.74) !important;
    backdrop-filter: blur(18px) saturate(135%) !important;
    -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
}

.tg-score-layer-panel {
    border: 1px solid rgba(255,255,255,.16) !important;
    border-radius: 26px !important;
    background:
        linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.02)),
        rgba(20, 23, 30, .96) !important;
    box-shadow: 0 28px 90px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.10) !important;
}

.tg-app-bottomnav {
    bottom: calc(12px + env(safe-area-inset-bottom)) !important;
    width: min(calc(100% - 24px), 696px) !important;
    gap: 2px !important;
    padding: 12px 14px 13px !important;
    border: 1px solid rgba(255,255,255,.16) !important;
    border-top-color: rgba(255,255,255,.28) !important;
    border-bottom-color: rgba(255,122,0,.22) !important;
    border-radius: 30px !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.018)),
        rgba(15, 17, 21, .78) !important;
    box-shadow: 0 22px 70px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.09) !important;
    backdrop-filter: blur(20px) saturate(140%) !important;
    -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
    overflow: visible !important;
}

.tg-app-bottomnav::before {
    content: "";
    position: absolute;
    left: 16px;
    right: 16px;
    top: 0;
    height: 38%;
    border-radius: 30px 30px 18px 18px;
    background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0));
    pointer-events: none;
    opacity: .48;
}

.tg-nav-item {
    min-height: 66px !important;
    padding: 8px 4px !important;
    border: 0 !important;
    border-radius: 22px !important;
    background: transparent !important;
    color: rgba(255,255,255,.62) !important;
    box-shadow: none !important;
    transition: transform .16s ease, color .16s ease, background .16s ease !important;
}

.tg-nav-icon svg {
    width: 24px !important;
    height: 24px !important;
}

.tg-nav-label {
    font-size: 10.5px !important;
    font-weight: 800 !important;
}

.tg-nav-item.is-active {
    color: var(--tg-modern-primary-2) !important;
    background: rgba(255,122,0,.09) !important;
}

.tg-nav-item.is-active::after {
    content: "";
    width: 24px;
    height: 3px;
    margin-top: 1px;
    border-radius: 999px;
    background: var(--tg-modern-primary);
    box-shadow: 0 0 14px rgba(255,122,0,.8);
}

.tg-nav-item.is-scan {
    color: rgba(255,255,255,.72) !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
}

.tg-nav-item.is-scan .tg-nav-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 58px !important;
    height: 58px !important;
    margin-top: -30px !important;
    border-radius: 999px !important;
    color: #fff !important;
    background: linear-gradient(180deg, #ffb257 0%, var(--tg-modern-primary) 100%) !important;
    box-shadow: 0 16px 38px rgba(255,122,0,.42), inset 0 1px 0 rgba(255,255,255,.34) !important;
}

.tg-nav-item.is-scan .tg-nav-icon svg {
    width: 28px !important;
    height: 28px !important;
}

.tg-nav-item.is-scan .tg-nav-label {
    margin-top: -2px !important;
}

.tg-nav-item.is-scan.is-active {
    background: transparent !important;
    color: var(--tg-modern-primary-2) !important;
}

.tg-nav-item.is-scan.is-active .tg-nav-icon {
    transform: translateY(-2px) !important;
    box-shadow: 0 18px 46px rgba(255,122,0,.55), inset 0 1px 0 rgba(255,255,255,.38) !important;
}

.tg-nav-item.is-scan.is-active::after {
    margin-top: 2px;
}

.tg-profile-grid,
.tg-home-stats-grid,
.tg-stats-grid {
    gap: 10px !important;
}

.tg-profile-grid div,
.tg-stat-card,
.tg-home-stat {
    text-align: center;
}

input,
textarea,
select {
    accent-color: var(--tg-modern-primary);
}

.tg-app-shell input[type="text"],
.tg-app-shell input[type="search"],
.tg-app-shell input[type="number"],
.tg-app-shell textarea,
.tg-app-shell select {
    color: #fff !important;
    border: 1px solid rgba(255,255,255,.14) !important;
    border-radius: 15px !important;
    background: rgba(255,255,255,.055) !important;
}

.tg-text-link,
.tg-app-shell a:not(.tg-app-button):not(.tg-nav-item):not(.tg-topbar-logo):not(.tg-topbar-profile) {
    color: var(--tg-modern-primary-2) !important;
}

@media (max-width: 480px) {
    .tg-app-shell {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    .tg-app-topbar,
    .tg-app-bottomnav {
        width: calc(100% - 18px) !important;
    }

    .tg-app-topbar {
        grid-template-columns: 52px 1fr 52px !important;
        border-radius: 20px !important;
    }

    .tg-topbar-logo,
    .tg-topbar-profile {
        width: 46px !important;
        height: 46px !important;
    }

    .tg-app-bottomnav {
        padding-left: 8px !important;
        padding-right: 8px !important;
        border-radius: 28px !important;
    }

    .tg-nav-label {
        font-size: 9.8px !important;
    }

    .tg-nav-item.is-scan .tg-nav-icon {
        width: 56px !important;
        height: 56px !important;
    }
}

@supports not ((backdrop-filter: blur(12px)) or (-webkit-backdrop-filter: blur(12px))) {
    .tg-app-topbar,
    .tg-app-bottomnav,
    .tg-score-layer-backdrop {
        background: rgba(15,17,21,.96) !important;
    }
}

/* v1.0.1: Feinabstimmung nach Testfeedback */
.tg-app-bottomnav {
    bottom: calc(2px + env(safe-area-inset-bottom)) !important;
}

.tg-nav-item.is-active,
.tg-nav-item.is-active .tg-nav-icon,
.tg-nav-item.is-active .tg-nav-label,
.tg-nav-item.is-scan.is-active {
    color: #ffffff !important;
}

.tg-topbar-profile::after {
    content: none !important;
    display: none !important;
}

.tg-app-card.tg-app-muted > p > a.tg-app-button.tg-app-button-secondary[href*="tg_special=map"],
.tg-app-card.tg-app-muted > p > a.tg-app-button.tg-app-button-secondary[href*="tg_special%3Dmap"] {
    color: #111111 !important;
    border: 0 !important;
    background: linear-gradient(180deg, #ffb257 0%, var(--tg-modern-primary) 100%) !important;
    box-shadow: 0 10px 28px rgba(255,122,0,.28), inset 0 1px 0 rgba(255,255,255,.35) !important;
}

.tg-profile-claim-button,
button.tg-profile-claim-button,
.tg-login-claim-form .tg-app-button {
    color: #111111 !important;
}

/* v1.0.2: Profil-Buttons und aktiver Settings-Button */
.tg-player-list-item .tg-mini-button,
.tg-player-list-card .tg-mini-button,
.tg-player-list a.tg-mini-button,
.tg-player-list button.tg-mini-button,
.tg-profile-card .tg-app-button,
.tg-profile-card button.tg-app-button,
.tg-profile-card a.tg-app-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 46px !important;
    padding: 12px 17px !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: linear-gradient(180deg, #ffb257 0%, var(--tg-modern-primary) 100%) !important;
    color: #111111 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    box-shadow: 0 10px 28px rgba(255,122,0,.28), inset 0 1px 0 rgba(255,255,255,.35) !important;
}

.tg-player-list-item .tg-mini-button svg,
.tg-player-list-card .tg-mini-button svg,
.tg-profile-card .tg-app-button svg {
    color: #111111 !important;
}

.tg-player-list-item .tg-mini-button:active,
.tg-profile-card .tg-app-button:active {
    transform: translateY(1px) scale(.99) !important;
}

.tg-topbar-profile.is-active,
body:has(.tg-more-card) .tg-topbar-profile,
body:has(.tg-app-install-settings-card) .tg-topbar-profile,
body:has(.tg-push-permission-card) .tg-topbar-profile,
body:has(.tg-more-special-entry) .tg-topbar-profile {
    color: #ffffff !important;
    border-color: rgba(255,122,0,.48) !important;
    background:
        linear-gradient(180deg, rgba(255,178,87,.98) 0%, rgba(255,122,0,.96) 100%) !important;
    box-shadow: 0 12px 34px rgba(255,122,0,.34), inset 0 1px 0 rgba(255,255,255,.34) !important;
}

.tg-topbar-profile.is-active svg,
body:has(.tg-more-card) .tg-topbar-profile svg,
body:has(.tg-app-install-settings-card) .tg-topbar-profile svg,
body:has(.tg-push-permission-card) .tg-topbar-profile svg,
body:has(.tg-more-special-entry) .tg-topbar-profile svg {
    color: #ffffff !important;
    stroke: currentColor !important;
}


/* v1.0.3: Standardisierung einzelner Rest-Buttons */
a.tg-app-button.tg-app-button-secondary[href*="tg_tab=map"],
a.tg-app-button.tg-app-button-secondary[href*="tg_tab%3Dmap"],
a.tg-app-button.tg-app-button-secondary[href*="tg_special=map"],
a.tg-app-button.tg-app-button-secondary[href*="tg_special%3Dmap"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 48px !important;
    padding: 13px 18px !important;
    color: #111111 !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: linear-gradient(180deg, #ffb257 0%, var(--tg-modern-primary) 100%) !important;
    box-shadow: 0 10px 28px rgba(255,122,0,.28), inset 0 1px 0 rgba(255,255,255,.35) !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    text-align: center !important;
}

/* Profil-Buttons in Listen konsequent wie Standardbutton gestalten */
a.tg-mini-button[href*="tg_view_player="],
button.tg-mini-button[name*="player"],
.tg-mini-button.tg-player-profile-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 48px !important;
    padding: 13px 18px !important;
    color: #111111 !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: linear-gradient(180deg, #ffb257 0%, var(--tg-modern-primary) 100%) !important;
    box-shadow: 0 10px 28px rgba(255,122,0,.28), inset 0 1px 0 rgba(255,255,255,.35) !important;
    font-size: 14px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    text-align: center !important;
}

button.tg-app-button.tg-app-button-small,
.tg-app-button.tg-app-button-small {
    min-height: 42px !important;
    padding: 10px 15px !important;
    font-size: 14px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
}

/* v1.0.4: harte Korrektur für Spieler-Profil-Buttons (.tg-mini-button)
   Ursache: einzelne Core-Layouts geben Profil-Links nur als .tg-mini-button aus und liegen nicht immer innerhalb der bisher erwarteten Listen-Container. */
html body a.tg-mini-button,
html body a.tg-mini-button:link,
html body a.tg-mini-button:visited,
html body .tg-app-shell a.tg-mini-button,
html body .tg-app-shell a.tg-mini-button:link,
html body .tg-app-shell a.tg-mini-button:visited,
html body .tg-app-shell .tg-mini-button,
html body .tg-player-card a.tg-mini-button,
html body .tg-player-profile a.tg-mini-button,
html body .tg-players-list a.tg-mini-button,
html body .tg-player-list a.tg-mini-button,
html body a.tg-mini-button[href*="tg_view_player"],
html body a.tg-mini-button[href*="tg_view_player="] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-height: 48px !important;
    padding: 13px 18px !important;
    color: #111111 !important;
    border: 0 !important;
    border-radius: 15px !important;
    background: linear-gradient(180deg, #ffb257 0%, var(--tg-modern-primary, #ff7a00) 100%) !important;
    box-shadow: 0 10px 28px rgba(255,122,0,.28), inset 0 1px 0 rgba(255,255,255,.35) !important;
    font-size: 14px !important;
    line-height: 1.1 !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    text-align: center !important;
    letter-spacing: .01em !important;
    white-space: nowrap !important;
}

html body a.tg-mini-button:hover,
html body .tg-app-shell a.tg-mini-button:hover,
html body a.tg-mini-button[href*="tg_view_player"]:hover {
    color: #111111 !important;
    background: linear-gradient(180deg, #ffc06f 0%, var(--tg-modern-primary, #ff7a00) 100%) !important;
    text-decoration: none !important;
}

html body a.tg-mini-button:active,
html body .tg-app-shell a.tg-mini-button:active,
html body a.tg-mini-button[href*="tg_view_player"]:active {
    color: #111111 !important;
    transform: translateY(1px) scale(.99) !important;
}

/* v1.0.5: maximal robuste Korrektur für Profil-Buttons.
   Der Core/andere Styles können .tg-mini-button nachträglich überschreiben; diese Regeln greifen unabhängig vom Container. */
html body .tg-app-shell a[class~="tg-mini-button"],
html body .tg-app-shell a[class~="tg-mini-button"]:link,
html body .tg-app-shell a[class~="tg-mini-button"]:visited,
html body a[class~="tg-mini-button"],
html body a[class~="tg-mini-button"]:link,
html body a[class~="tg-mini-button"]:visited,
html body a[class~="tg-mini-button"][href*="tg_view_player"],
html body a[class~="tg-mini-button"][href*="tg_view_player="] {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    background-color: #ff8a18 !important;
    background-image: linear-gradient(180deg, #ffb257 0%, #ff7a00 100%) !important;
    border: 0 !important;
    border-radius: 15px !important;
    box-shadow: 0 10px 28px rgba(255,122,0,.28), inset 0 1px 0 rgba(255,255,255,.35) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 48px !important;
    padding: 13px 18px !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    line-height: 1.1 !important;
    text-decoration: none !important;
    text-shadow: none !important;
    opacity: 1 !important;
    mix-blend-mode: normal !important;
    filter: none !important;
}

html body .tg-app-shell a[class~="tg-mini-button"] *,
html body a[class~="tg-mini-button"] * {
    color: #111111 !important;
    -webkit-text-fill-color: #111111 !important;
    fill: #111111 !important;
    stroke: #111111 !important;
}