.hbn10-live-center,.hbn10-match-flow{--hbn10-red:#e92f4c;--hbn10-ink:#101426;--hbn10-muted:#667085;--hbn10-line:#e5e9f0;--hbn10-card:#fff;--hbn10-soft:#f7f8fb;--hbn10-green:#087443;--hbn10-amber:#9a5b00;--hbn10-danger:#b42318;color:var(--hbn10-ink)}
.hbn10-live-center{max-width:1180px;margin:0 auto;padding:0 0 34px}
.hbn10-hero{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:28px;border:1px solid var(--hbn10-line);border-radius:22px;background:radial-gradient(circle at 90% 10%,rgba(233,47,76,.12),transparent 35%),linear-gradient(135deg,#fff,#fff9fa);box-shadow:0 18px 52px rgba(16,20,38,.07)}
.hbn10-hero>div>span{display:inline-flex;color:var(--hbn10-red);font-size:12px;font-weight:900;letter-spacing:.11em}.hbn10-hero h2{margin:8px 0;font-size:clamp(28px,4.5vw,46px);line-height:1.03}.hbn10-hero p{max-width:780px;margin:0;color:var(--hbn10-muted);font-size:16px;line-height:1.65}.hbn10-hero>strong{min-width:132px;color:var(--hbn10-red);font-size:42px;text-align:center}.hbn10-hero>strong small{display:block;color:var(--hbn10-muted);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em}
.hbn10-status{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin:15px 0;padding:13px 15px;border:1px solid var(--hbn10-line);border-radius:14px;background:var(--hbn10-card)}.hbn10-status>span{display:flex;align-items:center;gap:9px}.hbn10-status i,.hbn10-freshness i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#98a2b3}.hbn10-status small{color:var(--hbn10-muted);font-size:12px}.hbn10-status button{min-height:38px;padding:7px 13px;border:1px solid var(--hbn10-line);border-radius:10px;background:var(--hbn10-soft);color:var(--hbn10-ink);font-weight:800;cursor:pointer}.hbn10-status button:hover,.hbn10-status button:focus-visible{border-color:var(--hbn10-red);outline:0}.hbn10-status.is-fresh i,.hbn10-card.is-fresh .hbn10-freshness i{background:var(--hbn10-green);box-shadow:0 0 0 5px rgba(8,116,67,.1)}.hbn10-status.is-delayed i,.hbn10-card.is-delayed .hbn10-freshness i{background:#f79009;box-shadow:0 0 0 5px rgba(247,144,9,.1)}.hbn10-status.is-stale i,.hbn10-card.is-stale .hbn10-freshness i{background:var(--hbn10-danger);box-shadow:0 0 0 5px rgba(180,35,24,.1)}.hbn10-status.is-loading button{opacity:.55;pointer-events:none}.hbn10-status.is-error{border-color:#fecdca;background:#fff4f2}
.hbn10-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px}.hbn10-metrics span{display:flex;flex-direction:column;padding:16px;border:1px solid var(--hbn10-line);border-radius:14px;background:var(--hbn10-card);color:var(--hbn10-muted);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.hbn10-metrics b{margin-bottom:4px;color:var(--hbn10-ink);font-size:26px;line-height:1}
.hbn10-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.hbn10-card{overflow:hidden;border:1px solid var(--hbn10-line);border-radius:16px;background:var(--hbn10-card);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.hbn10-card:hover{transform:translateY(-2px);border-color:#f1a5b1;box-shadow:0 16px 38px rgba(16,20,38,.08)}.hbn10-card.is-live{border-color:#f8a8b5}.hbn10-card>a{display:block;padding:17px;color:inherit;text-decoration:none}.hbn10-card header,.hbn10-card footer{display:flex;align-items:center;justify-content:space-between;gap:12px}.hbn10-card header span{overflow:hidden;color:var(--hbn10-muted);font-size:12px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.hbn10-card header b{padding:4px 8px;border-radius:999px;background:#eef1f5;color:#475467;font-size:10px;letter-spacing:.07em}.hbn10-card.is-live header b{background:var(--hbn10-red);color:#fff}.hbn10-score{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:13px;margin:19px 0}.hbn10-score strong{font-size:15px;line-height:1.3}.hbn10-score strong:last-child{text-align:right}.hbn10-score em{min-width:76px;padding:9px 11px;border-radius:12px;background:var(--hbn10-ink);color:#fff;font-size:22px;font-style:normal;font-weight:900;text-align:center}.hbn10-card footer{padding-top:12px;border-top:1px solid var(--hbn10-line)}.hbn10-card footer span{display:flex;align-items:center;gap:8px;color:var(--hbn10-muted);font-size:11px;font-weight:800}.hbn10-card footer>b{color:var(--hbn10-red);font-size:12px}.hbn10-card.is-upcoming,.hbn10-card.is-finished{box-shadow:none}
.hbn10-fallback{grid-column:1/-1}.hbn10-fallback>h3{margin:8px 0 11px;font-size:17px}.hbn10-fallback>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.hbn10-empty{grid-column:1/-1;padding:42px;border:1px dashed var(--hbn10-line);border-radius:16px;background:var(--hbn10-soft);text-align:center}.hbn10-empty b{font-size:17px}.hbn10-empty p{max-width:680px;margin:8px auto 0;color:var(--hbn10-muted);line-height:1.6}
.hbn10-method{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:15px;margin-top:18px;padding:16px;border:1px solid var(--hbn10-line);border-radius:14px;background:var(--hbn10-soft)}.hbn10-method p{margin:0;color:var(--hbn10-muted);font-size:13px;line-height:1.55}.hbn10-method a{color:var(--hbn10-red);font-size:12px;font-weight:900;text-decoration:none}
.hbn10-match-flow{margin:0 0 20px;padding:18px;border:1px solid var(--hbn10-line);border-radius:18px;background:var(--hbn10-card);box-shadow:0 15px 40px rgba(16,20,38,.055)}.hbn10-match-flow>header{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-bottom:14px;border-bottom:1px solid var(--hbn10-line)}.hbn10-match-flow>header span{color:var(--hbn10-red);font-size:11px;font-weight:900;letter-spacing:.09em}.hbn10-match-flow>header h2{margin:5px 0 0;font-size:21px}.hbn10-match-flow>header>strong{min-width:110px;padding:9px 11px;border-radius:12px;background:var(--hbn10-soft);font-size:13px;text-align:center}.hbn10-match-flow>header>strong small{display:block;margin-top:2px;color:var(--hbn10-muted);font-size:10px}.hbn10-match-flow>header>strong.is-fresh{background:#ecfdf3;color:var(--hbn10-green)}.hbn10-match-flow>header>strong.is-delayed{background:#fffaeb;color:var(--hbn10-amber)}.hbn10-match-flow>header>strong.is-stale{background:#fef3f2;color:var(--hbn10-danger)}
.hbn10-flow-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:14px 0}.hbn10-flow-metrics span{display:flex;flex-direction:column;min-width:0;padding:12px;border-radius:12px;background:var(--hbn10-soft);color:var(--hbn10-muted);font-size:10px;font-weight:800;text-transform:uppercase}.hbn10-flow-metrics b{overflow:hidden;margin-bottom:3px;color:var(--hbn10-ink);font-size:21px;text-overflow:ellipsis;white-space:nowrap}
.hbn10-timeline{margin-top:14px}.hbn10-timeline>h3{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 10px;font-size:17px}.hbn10-timeline>h3 small{color:var(--hbn10-muted);font-size:10px;font-weight:700;text-transform:uppercase}.hbn10-timeline>div:not(.hbn10-empty){display:grid;gap:7px}.hbn10-timeline article{display:grid;grid-template-columns:74px 1fr auto;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--hbn10-line);border-radius:12px;background:var(--hbn10-card)}.hbn10-timeline article time{color:var(--hbn10-ink);font-size:14px;font-weight:900}.hbn10-timeline article time small{display:block;color:var(--hbn10-muted);font-size:9px;font-weight:700}.hbn10-timeline article>div{display:grid;gap:2px}.hbn10-timeline article>div b{font-size:13px}.hbn10-timeline article>div span{color:var(--hbn10-muted);font-size:11px}.hbn10-timeline article>strong{min-width:50px;text-align:right;font-size:16px}.hbn10-timeline article.is-goal{border-left:4px solid var(--hbn10-red)}.hbn10-timeline article.is-discipline{border-left:4px solid #f79009}.hbn10-timeline article.is-timeout{border-left:4px solid #6172f3}.hbn10-timeline article.is-save{border-left:4px solid var(--hbn10-green)}
.hbn10-snapshots article{grid-template-columns:85px 1fr auto}.hbn10-snapshots article b{font-size:16px}.hbn10-snapshots article span{color:var(--hbn10-muted);font-size:11px}.hbn10-match-flow>footer{display:flex;justify-content:space-between;gap:18px;margin-top:14px;padding-top:13px;border-top:1px solid var(--hbn10-line)}.hbn10-match-flow>footer p{max-width:760px;margin:0;color:var(--hbn10-muted);font-size:11px;line-height:1.55}.hbn10-match-flow>footer small{color:var(--hbn10-muted);font-size:10px;white-space:nowrap}
body.dark-mode .hbn10-live-center,body.hbn-dark .hbn10-live-center,body.dark-mode .hbn10-match-flow,body.hbn-dark .hbn10-match-flow{--hbn10-ink:#f4f6fb;--hbn10-muted:#a9b2c3;--hbn10-line:#2b3242;--hbn10-card:#171c28;--hbn10-soft:#111620}.dark-mode .hbn10-hero,.hbn-dark .hbn10-hero{background:radial-gradient(circle at 90% 10%,rgba(233,47,76,.18),transparent 38%),linear-gradient(135deg,#171c28,#221820)}.dark-mode .hbn10-score em,.hbn-dark .hbn10-score em{background:#f4f6fb;color:#101426}.dark-mode .hbn10-status.is-error,.hbn-dark .hbn10-status.is-error{background:#35191b}.dark-mode .hbn10-match-flow>header>strong.is-fresh,.hbn-dark .hbn10-match-flow>header>strong.is-fresh{background:#123326}.dark-mode .hbn10-match-flow>header>strong.is-delayed,.hbn-dark .hbn10-match-flow>header>strong.is-delayed{background:#382b12}.dark-mode .hbn10-match-flow>header>strong.is-stale,.hbn-dark .hbn10-match-flow>header>strong.is-stale{background:#3b1c20}
@media(max-width:900px){.hbn10-metrics,.hbn10-flow-metrics{grid-template-columns:repeat(2,1fr)}.hbn10-grid,.hbn10-fallback>div{grid-template-columns:1fr}.hbn10-method{grid-template-columns:1fr}.hbn10-hero{align-items:flex-start}.hbn10-hero>strong{min-width:auto}.hbn10-status{grid-template-columns:1fr auto}.hbn10-status>small{grid-column:1/-1;grid-row:2}}
@media(max-width:580px){.hbn10-live-center{padding-bottom:22px}.hbn10-hero{display:block;padding:19px;border-radius:16px}.hbn10-hero>strong{display:block;margin-top:15px;text-align:left}.hbn10-status{display:flex;flex-wrap:wrap}.hbn10-status>small{width:100%;order:3}.hbn10-status button{margin-left:auto}.hbn10-metrics{gap:8px}.hbn10-metrics span{padding:12px}.hbn10-card>a{padding:14px}.hbn10-score{grid-template-columns:1fr 64px 1fr;gap:7px}.hbn10-score strong{font-size:13px}.hbn10-score em{min-width:0;padding:8px 6px;font-size:18px}.hbn10-card footer{align-items:flex-end}.hbn10-match-flow{padding:14px;border-radius:14px}.hbn10-match-flow>header{align-items:flex-start}.hbn10-match-flow>header h2{font-size:17px}.hbn10-match-flow>header>strong{min-width:86px}.hbn10-flow-metrics{gap:7px}.hbn10-flow-metrics span{padding:10px}.hbn10-timeline article{grid-template-columns:58px 1fr auto;gap:8px;padding:10px 9px}.hbn10-match-flow>footer{display:grid}.hbn10-match-flow>footer small{white-space:normal}}
@media(prefers-reduced-motion:reduce){.hbn10-card{transition:none}.hbn10-card:hover{transform:none}}