/* brand/bracket.css — Phase 3 desktop double-elim drawing. No images. Phone pinch-zoom is phase 4. */
.tmg-de-scroll {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    padding-bottom: .35rem;
}

.tmg-de-board {
    align-items: flex-start;
    display: flex;
    gap: 2.5rem;
    min-width: 100%;
    width: max-content;
}

.tmg-de-board-split {
    /* Winners and losers stay side by side. The scroll box moves; the drawing does not squash. */
}

.tmg-de-side {
    min-width: max-content;
}

.tmg-de-side-title {
    font-size: 1.05rem;
    margin: 0 0 .65rem;
}

.tmg-de-grand {
    margin-top: 1.35rem;
    max-width: 22rem;
}

.tmg-de-grand-note {
    color: var(--tmg-muted);
    font-size: .85rem;
    margin: -.35rem 0 .7rem;
}

.tmg-de-flow {
    align-items: stretch;
    display: flex;
}

.tmg-de-col {
    display: flex;
    flex: 0 0 12.5rem;
    flex-direction: column;
    width: 12.5rem;
}

.tmg-de-col-head {
    align-items: flex-end;
    box-sizing: border-box;
    color: var(--tmg-muted);
    display: flex;
    font-size: .75rem;
    gap: .35rem;
    height: 2.5rem;
    letter-spacing: .04em;
    line-height: 1.2;
    margin: 0;
    padding-bottom: .35rem;
    text-transform: uppercase;
}

.tmg-de-col-name {
    color: var(--tmg-mist);
}

.tmg-de-col-status {
    font-weight: 500;
    text-transform: none;
}

.tmg-de-slots,
.tmg-de-joins-body {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
}

.tmg-de-slot,
.tmg-de-join,
.tmg-de-stub {
    display: flex;
    flex: 1 1 0;
    min-height: 4.75rem;
}

.tmg-de-slot {
    align-items: center;
}

.tmg-de-joins {
    box-sizing: border-box;
    display: flex;
    flex: 0 0 2.25rem;
    flex-direction: column;
    padding-top: 2.5rem;
    width: 2.25rem;
}

.tmg-de-join,
.tmg-de-stub {
    position: relative;
}

.tmg-de-join-pair::before,
.tmg-de-join-pair::after {
    border-top: 2px solid var(--tmg-teal);
    content: "";
    left: 0;
    position: absolute;
    width: 50%;
}

.tmg-de-join-pair::before {
    top: 25%;
}

.tmg-de-join-pair::after {
    top: 75%;
}

.tmg-de-bus {
    border-left: 2px solid var(--tmg-teal);
    bottom: 25%;
    left: 50%;
    position: absolute;
    top: 25%;
}

.tmg-de-stem {
    border-top: 2px solid var(--tmg-teal);
    left: 50%;
    position: absolute;
    right: 0;
    top: 50%;
}

.tmg-de-join-straight::before,
.tmg-de-stub::before {
    border-top: 2px solid var(--tmg-teal);
    content: "";
    left: 0;
    position: absolute;
    top: 50%;
}

.tmg-de-join-straight::before {
    right: 0;
}

.tmg-de-stub::before {
    border-top-color: var(--tmg-muted);
    width: 55%;
}

.tmg-de-card {
    background: color-mix(in srgb, var(--tmg-ink) 55%, var(--tmg-panel));
    border: 1px solid var(--tmg-border);
    border-radius: .4rem;
    color: inherit;
    display: flex;
    flex-direction: column;
    min-height: 3.6rem;
    padding: .35rem .55rem .4rem;
    text-decoration: none;
    width: 100%;
}

a.tmg-de-card-link:hover,
a.tmg-de-card-link:focus-visible {
    border-color: var(--tmg-teal);
    outline: 2px solid var(--tmg-teal);
    outline-offset: 2px;
}

.tmg-de-card-static {
    cursor: default;
}

.tmg-de-meta {
    color: var(--tmg-muted);
    font-size: .68rem;
    letter-spacing: .03em;
    margin-bottom: .15rem;
}

.tmg-de-open {
    color: var(--tmg-teal);
}

.tmg-de-row {
    align-items: baseline;
    border-bottom: 1px solid var(--tmg-border);
    display: flex;
    font-size: .82rem;
    gap: .4rem;
    justify-content: space-between;
    line-height: 1.25;
    padding: .15rem 0;
}

.tmg-de-row:last-child {
    border-bottom: 0;
}

.tmg-de-row.is-winner {
    color: var(--tmg-teal);
    font-weight: 700;
}

.tmg-de-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tmg-de-score {
    font-variant-numeric: tabular-nums;
}

.tmg-de-status-complete {
    opacity: .92;
}

.tmg-de-zoombar {
    display: flex;
    gap: .4rem;
    margin: 0 0 .6rem;
}
.tmg-de-zoombar button {
    background: transparent;
    border: 1px solid var(--tmg-border);
    border-radius: .35rem;
    color: var(--tmg-mist);
    font: inherit;
    min-height: 2.4rem;
    padding: .2rem .7rem;
}
.tmg-de-stage {
    transform-origin: 0 0;
}
.tmg-de-scroll-thumb {
    max-height: 11rem;
    max-width: 18rem;
    overflow: hidden;
    pointer-events: none;
}
.tmg-de-scroll-thumb .tmg-de-stage {
    transform: scale(.38);
    transform-origin: 0 0;
}
.tmg-signup-feed,
.tmg-recent-results,
.tmg-h2h {
    margin: 1.25rem 0;
}
.tmg-signup-feed-list,
.tmg-h2h-list,
.tmg-achievements {
    margin: .35rem 0 1rem;
    padding-left: 1.1rem;
}
.tmg-prize-held {
    font-weight: 700;
}
.tmg-tier-mark,
.tmg-champion-mark,
.tmg-achievement {
    border: 1px solid var(--tmg-border);
    border-radius: .3rem;
    display: inline-block;
    font-size: .78rem;
    margin: 0 .25rem .25rem 0;
    padding: .1rem .4rem;
}
.tmg-champion-mark {
    border-color: var(--tmg-teal);
    color: var(--tmg-teal);
}
@media (max-width: 40rem) {
    .tmg-de-scroll {
        overflow-x: auto;
    }
    .tmg-de-board-split {
        /* Stay side by side. Scroll and pinch; do not stack into a crushed column. */
    }
}