:root{font-family:system-ui,sans-serif;color:#e8f4fc;background:#07131e}*{box-sizing:border-box}body{margin:0}header,main{padding:20px;max-width:1500px;margin:auto}a{color:#6ac6ff}h1{margin-bottom:4px}.cards{display:flex;flex-wrap:wrap;gap:14px}.card,.panel{background:#102738;border:1px solid #28506a;border-radius:12px;padding:16px}.card{display:block;min-width:240px;text-decoration:none;color:inherit}.card:hover{border-color:#68caff}.muted,#updated{color:#a4bfd0}.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:16px 0}button{background:#176596;color:white;border:0;border-radius:6px;padding:9px 15px;cursor:pointer}#viewport{height:72vh;min-height:480px;overflow:hidden;touch-action:none;border:1px solid #28506a;border-radius:12px;background:radial-gradient(circle at 30% 15%,#112b3b,#081b29 65%);position:relative;cursor:grab}#viewport:active{cursor:grabbing}#tree{position:absolute;transform-origin:0 0;display:flex;flex-direction:column;align-items:flex-start;gap:70px;padding:18px 20px 40px}.bracket-side{position:relative}.side-title{font-size:16px;letter-spacing:.06em;text-transform:uppercase;color:#82cfff;margin:0 0 16px 12px}.bracket-canvas{position:relative}.connections{position:absolute;inset:0;overflow:visible;pointer-events:none}.connections path{stroke:#517e99;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}.round-label{position:absolute;top:0;width:244px;color:#86bcd6;font-size:11px;font-weight:750;letter-spacing:.12em}.match{position:absolute;width:244px;height:104px;border:1px solid #34586d;background:#122c3d;border-radius:7px;overflow:hidden;box-shadow:0 5px 14px #0003}.match.playing{border-color:#40c78b;box-shadow:0 0 0 1px #40c78b55}.match.ready{border-color:#5c9dd5}.match-top{height:25px;background:#1a3a4d;color:#a9c8db;padding:5px 8px;font-size:10px;font-weight:750;display:flex;justify-content:space-between;gap:5px}.player{height:33px;display:flex;align-items:center;justify-content:space-between;padding:0 9px;gap:7px;font-size:12px;border-top:1px solid #ffffff12}.player-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.score{white-space:nowrap;color:#a7c4d4;font-variant-numeric:tabular-nums}.winner .player-name,.winner .score{color:#80e6ac;font-weight:750}#payouts{display:flex;flex-wrap:wrap;gap:10px}.panel{margin:5px 0}#payouts .panel{min-width:150px}small{color:#a4bfd0}@media(max-width:650px){header,main{padding:14px}#viewport{height:68vh;min-height:420px}.toolbar span{font-size:12px}}

/* Desktop-style championship placement: to the right of the no-loss final. */
.bracket-top-row{display:flex;align-items:center;gap:70px;width:max-content}.bracket-top-row>.bracket-side{flex:none}

/* Keep the table visible alongside the match status, including after completion. */
.match-meta{display:flex;align-items:center;gap:7px;white-space:nowrap}.match-table{color:#80e6ac}.match-status{color:#a9c8db}

/* Clearly distinguish an active, table-assigned match on the public bracket. */
.match.playing{border:2px solid #40e79a;box-shadow:0 0 0 2px #40e79a77,0 0 18px #40e79a55;background:#163c36}
.match.playing .match-top{background:#17664b;color:#f1fff7}
.match.playing .match-table{color:#f1fff7}
.match.playing .player{border-top-color:#ffffff24}