.bracket-shell{width:100%;max-width:980px;margin:0 auto}.bracket-root{--line:color-mix(in oklab,var(--color-primary) 32%,transparent);--line-strong:color-mix(in oklab,var(--color-primary) 60%,transparent);--match-max:140px;--cover:30px;--gap-x:14px;--gap-y:8px;--slot-gap:3px;--name-fs:11px;--badge:15px;--slot-pad:4px;width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);grid-template-areas:"left final right";gap:var(--gap-x);align-items:stretch;padding:4px 2px}.bracket-root[data-size="8"]{--half-fr:2fr;--match-max:190px;--cover:36px;--gap-x:18px;--gap-y:10px;--name-fs:12px}.bracket-root[data-size="16"]{--half-fr:3fr;--match-max:140px;--cover:30px;--gap-x:14px;--gap-y:8px;--name-fs:11px}.bracket-root[data-size="32"]{--half-fr:4fr;--match-max:104px;--cover:26px;--gap-x:9px;--gap-y:5px;--name-fs:10px;--badge:13px}.bracket-root[data-layout=stack]{--slot-pad:3px;grid-template-columns:minmax(0,var(--half-fr)) minmax(0,1fr) minmax(0,var(--half-fr))}.bracket-root[data-layout=stack][data-size="8"]{--match-max:96px;--gap-x:12px;--gap-y:8px;--name-fs:10px}.bracket-root[data-layout=stack][data-size="16"]{--match-max:64px;--gap-x:8px;--gap-y:5px;--name-fs:9px}.bracket-root[data-layout=stack][data-size="32"]{--match-max:44px;--gap-x:5px;--gap-y:3px;--name-fs:9px;--badge:12px}.bracket-half{display:flex;min-width:0}.bracket-half.left{grid-area:left;flex-direction:row}.bracket-half.right{grid-area:right;flex-direction:row-reverse}.bracket-round-col{display:flex;flex-direction:column;flex:1;min-width:0}.bracket-cell{--pad-x:max(calc(var(--gap-x) / 2),calc((100% - var(--match-max)) / 2));position:relative;flex:1 0 auto;display:flex;align-items:center;justify-content:center;padding:calc(var(--gap-y) / 2) var(--pad-x);min-width:0}.bracket-match{width:100%;min-width:0}.bracket-slots-stack{display:flex;flex-direction:column;gap:var(--slot-gap);min-width:0}.bracket-slot{position:relative;display:flex;align-items:center;gap:5px;width:100%;min-width:0;padding:var(--slot-pad);background:color-mix(in oklab,var(--color-primary) 4%,transparent);border:1px solid var(--color-border);border-radius:var(--radius-3xl);color:var(--color-foreground);font-size:var(--name-fs);line-height:1.15;transition:border-color .2s,background .2s}.bracket-root[data-layout=stack] .bracket-slot{flex-direction:column;gap:2px}.bracket-cover{position:relative;flex:0 0 auto;width:var(--cover,100%);min-width:0;aspect-ratio:1;border-radius:var(--radius-2xl);overflow:hidden;background:color-mix(in oklab,var(--color-foreground) 8%,transparent);box-shadow:inset 0 0 0 1px color-mix(in oklab,var(--color-foreground) 6%,transparent);transition:filter .3s,opacity .3s}.bracket-root[data-layout=stack] .bracket-cover{width:100%}.bracket-cover-img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center;display:block}.bracket-cover-fallback{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.85em;letter-spacing:.02em;color:color-mix(in oklab,var(--color-primary-light,#a78bfa) 85%,var(--color-foreground))}@supports (container-type:inline-size){.bracket-cover{container-type:inline-size}.bracket-cover-fallback{font-size:34cqi}}.bracket-slot-name{flex:1 1 auto;min-width:0;font-weight:600;letter-spacing:-.01em;color:var(--color-foreground);overflow-wrap:break-word;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;transition:color .3s,opacity .3s}.bracket-root[data-layout=stack] .bracket-slot-name{width:100%;text-align:center;-webkit-line-clamp:1;line-clamp:1;white-space:nowrap;text-overflow:ellipsis}.bracket-root[data-layout=row][data-size="32"] .bracket-slot-name{display:block;white-space:nowrap;text-overflow:ellipsis}.bracket-root[data-names=off] .bracket-slot-name{display:none}.bracket-vote-num{flex:0 0 auto;font-size:calc(var(--badge) * .62);font-weight:700;color:var(--color-accent-amber,#f59e0b);background:var(--color-card);padding:0 3px;min-width:var(--badge);height:var(--badge);border-radius:999px;border:1px solid color-mix(in oklab,var(--color-accent-amber,#f59e0b) 40%,transparent);display:flex;align-items:center;justify-content:center;line-height:1}.bracket-root[data-layout=row][data-size="32"] .bracket-vote-num,.bracket-root[data-layout=stack] .bracket-vote-num{position:absolute;top:-3px;right:-3px;z-index:3}.bracket-voted-mark{position:absolute;top:-3px;left:-3px;z-index:3;width:var(--badge);height:var(--badge);border-radius:999px;background:var(--color-primary);display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 1.5px var(--color-card),0 2px 4px rgba(0,0,0,.3)}.bracket-voted-mark:after{content:"";width:62%;height:62%;background:white;-webkit-mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41Z'/%3E%3C/svg%3E") center/contain no-repeat}.bracket-match.is-pending .bracket-slot{opacity:.5}.bracket-match.is-pending .bracket-cover{filter:grayscale(.8)}.bracket-match.is-open .bracket-slot{border-color:color-mix(in oklab,var(--color-primary) 35%,transparent);background:color-mix(in oklab,var(--color-primary) 8%,transparent)}.bracket-cell.is-tappable{cursor:pointer}.bracket-cell.is-tappable:focus-visible .bracket-slot,.bracket-cell.is-tappable:hover .bracket-slot{border-color:color-mix(in oklab,var(--color-primary) 55%,transparent);background:color-mix(in oklab,var(--color-primary) 12%,transparent)}.bracket-cell.is-tappable:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px;border-radius:var(--radius-3xl)}.bracket-slot.is-winner{border-color:var(--color-accent-green,#10b981);background:color-mix(in oklab,var(--color-accent-green,#10b981) 12%,transparent);box-shadow:0 0 0 1px color-mix(in oklab,var(--color-accent-green,#10b981) 25%,transparent),0 4px 12px -4px color-mix(in oklab,var(--color-accent-green,#10b981) 40%,transparent)}.bracket-slot.is-winner .bracket-vote-num{color:var(--color-accent-green,#10b981);border-color:color-mix(in oklab,var(--color-accent-green,#10b981) 40%,transparent)}.bracket-slot.is-loser{border-color:color-mix(in oklab,var(--color-accent-red,#ef4444) 25%,transparent);background:color-mix(in oklab,var(--color-accent-red,#ef4444) 4%,transparent)}.bracket-slot.is-loser .bracket-cover{filter:grayscale(.85);opacity:.4}.bracket-slot.is-loser .bracket-slot-name{color:var(--color-muted);opacity:.65;text-decoration:line-through}.bracket-slot.is-loser .bracket-vote-num{color:var(--color-accent-red,#ef4444);border-color:color-mix(in oklab,var(--color-accent-red,#ef4444) 40%,transparent);opacity:.85}.bracket-x{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:5;opacity:0}.bracket-slot.is-loser .bracket-x{opacity:1}.bracket-x line{stroke:var(--color-accent-red,#ef4444);stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 0 4px color-mix(in oklab,var(--color-accent-red,#ef4444) 60%,transparent));stroke-dasharray:200;stroke-dashoffset:200}.bracket-slot.is-loser .bracket-x line:first-child{animation:bracketDrawX .38s ease-out forwards}.bracket-slot.is-loser .bracket-x line:nth-child(2){animation:bracketDrawX .38s ease-out .14s forwards}@keyframes bracketDrawX{to{stroke-dashoffset:0}}@media (prefers-reduced-motion:reduce){.bracket-slot.is-loser .bracket-x line{animation:none;stroke-dashoffset:0}}.bracket-slot.is-empty{background:repeating-linear-gradient(135deg,color-mix(in oklab,var(--color-border) 70%,transparent) 0 6px,color-mix(in oklab,var(--color-card) 70%,transparent) 6px 12px);border-style:dashed;color:var(--color-muted)}.bracket-slot.is-empty .bracket-cover{opacity:.35}.bracket-half.left .bracket-round-col:not(.is-semis) .bracket-cell.is-pair-top:after{content:"";position:absolute;top:50%;right:0;width:var(--pad-x);height:50%;border-top:1px solid var(--line);border-right:1px solid var(--line);border-top-right-radius:6px;pointer-events:none}.bracket-half.left .bracket-round-col:not(.is-semis) .bracket-cell.is-pair-bot:after{content:"";position:absolute;bottom:50%;right:0;width:var(--pad-x);height:50%;border-bottom:1px solid var(--line);border-right:1px solid var(--line);border-bottom-right-radius:6px;pointer-events:none}.bracket-half.left .bracket-round-col.is-semis .bracket-cell:after{content:"";position:absolute;top:50%;right:calc(-1 * var(--gap-x));width:calc(var(--pad-x) + var(--gap-x));height:1px;background:var(--line);pointer-events:none}.bracket-half.left .bracket-round-col:not(.is-round-0) .bracket-cell:before{content:"";position:absolute;top:50%;left:0;width:var(--pad-x);height:1px;background:var(--line);pointer-events:none}.bracket-half.right .bracket-round-col:not(.is-semis) .bracket-cell.is-pair-top:after{content:"";position:absolute;top:50%;left:0;width:var(--pad-x);height:50%;border-top:1px solid var(--line);border-left:1px solid var(--line);border-top-left-radius:6px;pointer-events:none}.bracket-half.right .bracket-round-col:not(.is-semis) .bracket-cell.is-pair-bot:after{content:"";position:absolute;bottom:50%;left:0;width:var(--pad-x);height:50%;border-bottom:1px solid var(--line);border-left:1px solid var(--line);border-bottom-left-radius:6px;pointer-events:none}.bracket-half.right .bracket-round-col.is-semis .bracket-cell:after{content:"";position:absolute;top:50%;left:calc(-1 * var(--gap-x));width:calc(var(--pad-x) + var(--gap-x));height:1px;background:var(--line);pointer-events:none}.bracket-half.right .bracket-round-col:not(.is-round-0) .bracket-cell:before{content:"";position:absolute;top:50%;right:0;width:var(--pad-x);height:1px;background:var(--line);pointer-events:none}.bracket-cell.is-closed:after,.bracket-cell.is-closed:before{border-color:var(--line-strong)!important;background:var(--line-strong)}.bracket-half .bracket-round-col:not(.is-semis) .bracket-cell.is-closed:after{background:transparent}.bracket-final{grid-area:final;display:flex;align-items:stretch;justify-content:center}.bracket-final-stack{display:grid;grid-template-rows:1fr auto 1fr;align-items:center;justify-items:center;width:100%;height:100%}.bracket-cell.is-final-cell{grid-row:2;align-self:center;flex:0 0 auto;width:100%;max-width:var(--match-max);padding:0}.bracket-final-stack>.bracket-champion-display{grid-row:1;align-self:end;margin-bottom:10px}.bracket-final-stack>.bracket-final-label{grid-row:3;align-self:start;margin-top:8px}.bracket-match.is-final .bracket-slot{background:linear-gradient(180deg,color-mix(in oklab,var(--color-primary) 12%,transparent),color-mix(in oklab,var(--color-primary) 3%,transparent));border-color:color-mix(in oklab,var(--color-primary) 40%,transparent)}.bracket-match.is-final .bracket-slot.is-winner{background:linear-gradient(180deg,color-mix(in oklab,var(--color-accent-green,#10b981) 22%,transparent),color-mix(in oklab,var(--color-accent-green,#10b981) 5%,transparent))}.bracket-final-label{text-align:center;font-size:9px;font-weight:700;letter-spacing:.3em;color:var(--color-primary-light,#a78bfa);text-transform:uppercase}.bracket-champion-display{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 16px;border-radius:var(--radius-3xl);border:1px dashed var(--color-border);background:color-mix(in oklab,var(--color-primary) 5%,transparent);width:100%;max-width:200px;opacity:.55;transition:opacity .4s,border-color .4s,box-shadow .4s,background .4s}.bracket-champion-display-label{font-size:9px;letter-spacing:.3em;text-transform:uppercase;color:var(--color-primary-light,#a78bfa);font-weight:700}.bracket-champion-display .bracket-cover{width:120px;border-radius:var(--radius-3xl);background:var(--color-background)}.bracket-champion-display-name{font-size:13px;font-weight:700;text-align:center;color:var(--color-foreground);letter-spacing:-.01em;min-height:1.2em;line-height:1.2}.bracket-champion-display.is-decided{opacity:1;border-style:solid;border-color:var(--color-cta);background:linear-gradient(180deg,color-mix(in oklab,var(--color-cta) 18%,transparent),color-mix(in oklab,var(--color-primary) 8%,transparent));box-shadow:0 16px 36px -10px color-mix(in oklab,var(--color-cta) 40%,transparent),0 0 0 1px color-mix(in oklab,var(--color-cta) 30%,transparent)}.bracket-champion-display.is-decided .bracket-cover{box-shadow:0 0 0 3px color-mix(in oklab,var(--color-cta) 40%,transparent),0 12px 28px -6px rgba(0,0,0,.5)}.bracket-champion-display.is-decided .bracket-champion-display-label{color:var(--color-cta)}.bracket-champion-banner{display:flex;align-items:center;gap:12px;width:100%;max-width:none;flex-direction:row;padding:10px 12px;margin-bottom:8px}.bracket-champion-banner .bracket-cover{width:58px;flex:0 0 auto}.bracket-champion-banner .bracket-champion-display-text{display:flex;flex-direction:column;gap:2px;min-width:0;text-align:left}.bracket-champion-banner .bracket-champion-display-name{text-align:left;font-size:14px}