*{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;background:#0f0f1a;color:#fff;font-family:'Arial',sans-serif;overscroll-behavior:none;}
body{display:flex;flex-direction:column;align-items:center;min-height:100vh;}

/* top bar */
.topbar{width:100%;max-width:520px;display:flex;align-items:center;justify-content:space-between;padding:12px 16px 0;}
.topbar a{color:rgba(255,255,255,.45);font-size:12px;text-decoration:none;letter-spacing:.05em;}
.topbar a:hover{color:#FAC775;}
.site-logo{font-size:13px;font-weight:700;color:#FAC775;letter-spacing:.08em;}

/* event progress bar */
.progress-wrap{width:100%;max-width:520px;padding:10px 16px 0;display:flex;gap:6px;align-items:center;}
.progress-dot{flex:1;height:4px;border-radius:2px;background:rgba(255,255,255,.12);transition:background .3s;}
.progress-dot.done{background:#97C459;}
.progress-dot.active{background:#378ADD;}
.progress-label{font-size:11px;color:rgba(255,255,255,.35);margin-left:8px;white-space:nowrap;}

/* game canvas wrapper */
.game-wrap{width:100%;max-width:480px;padding:10px 16px 0;}

/* bottom nav between events */
.event-footer{width:100%;max-width:480px;padding:12px 16px;display:flex;justify-content:space-between;align-items:center;}
.event-footer .event-name{font-size:11px;color:rgba(255,255,255,.35);letter-spacing:.05em;}
.event-footer .match-score{font-size:14px;font-weight:700;color:#FAC775;}

/* score carry banner */
.score-carry{width:100%;max-width:480px;padding:6px 16px;}
.score-carry-inner{background:rgba(55,138,221,.12);border:1px solid rgba(55,138,221,.25);border-radius:8px;padding:8px 14px;display:flex;justify-content:space-between;align-items:center;}
.score-carry-inner span{font-size:12px;color:rgba(255,255,255,.5);}
.score-carry-inner strong{font-size:15px;color:#FAC775;}

/* overlay styles used in all events */
.ov{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:rgba(10,10,30,.9);border-radius:12px;}
.ov h2{font-size:30px;font-weight:700;color:#FAC775;letter-spacing:-1px;}
.ov p{font-size:13px;color:rgba(255,255,255,.6);text-align:center;padding:0 24px;line-height:1.65;}
.ov .score-big{font-size:42px;font-weight:700;color:#FAC775;}
.ov button{background:#378ADD;color:#fff;border:none;border-radius:8px;padding:11px 36px;font-size:15px;font-weight:700;cursor:pointer;margin-top:4px;}
.ov button:hover{background:#185FA5;}
.ov button.next{background:#639922;}
.ov button.next:hover{background:#3B6D11;}
.ov .sub{font-size:12px;color:rgba(255,255,255,.4);}