/* Arena panels share the same surface, typography and actions as the game HUD. */
dialog{color-scheme:dark;color:#fff8df;border:2px solid #83af62;background:linear-gradient(140deg,#105538,#003526 58%,#062e24);border-radius:26px;box-shadow:inset 0 2px 0 #ddffa540,0 24px 90px #001b17b3;padding:30px;scrollbar-color:#608b54 #073827}
dialog::backdrop{background:#001b20b8;backdrop-filter:blur(5px)}
dialog h2{color:#fff8df;text-transform:uppercase;line-height:1.05;margin-right:28px}
dialog p,dialog li{color:#dbe8cf;font-size:14px;line-height:1.6}
dialog strong{color:#fff8df}
dialog .eyebrow,dialog .overline,#score-dialog .overline{color:#dced95;font-size:10px;letter-spacing:1.3px}
.close-dialog{color:#f4f6d7;background:#002b20;border:1px solid #568b64;border-radius:12px;top:12px;right:12px;width:40px;height:40px;line-height:1}
.close-dialog:hover{background:#16533a;border-color:#e5f577}
dialog button:focus-visible,dialog select:focus-visible,dialog input:focus-visible,dialog summary:focus-visible{outline:3px solid #efff8b;outline-offset:3px}
dialog .pix-button,dialog .share-primary{background:linear-gradient(#f1fb6f,#deec38);color:#073827;border:1px solid #f1ffaf;border-radius:15px;box-shadow:inset 0 1px 0 #fff8,0 3px 0 #567d29;min-height:48px;font-weight:800}
dialog .share-primary:hover{background:#ecfc65}
.share-secondary{background:#064732;color:#f4f5d9;border:1px solid #608e69;border-radius:12px;box-shadow:inset 0 1px 0 #e7ffc31a}
.share-secondary:hover:enabled{background:#155c3c;border-color:#d6e99b}
#share-dialog{max-width:820px}
#share-dialog .share-modal-heading>p{font-size:14px}
.share-preview{background:#00291f;border:1px solid #608957;border-radius:17px;padding:9px;box-shadow:inset 0 2px 8px #001b1b70}
.share-preview img{border-radius:10px}.share-preview>small,.share-preview>span{color:#c8dcb2}
.share-controls select,.share-controls input[type=text],#share-nickname,.share-controls textarea{background:#002d21;border:1px solid #64976c;color:#fff8df;border-radius:10px;font-size:14px}
.share-label{font-size:13px;color:#fff8df}.share-label span,#share-personal small,#share-personal legend,#share-native-hint,#share-dialog .share-link-note{color:#bed2b3;font-size:12px}
#share-personal,.share-message{border-color:#5d865d}.share-check{font-size:13px}.share-check input{accent-color:#e5f577}
#share-dialog .share-mode-note{background:#ffffff09;border:1px solid #65865c;border-radius:10px;font-size:12px;color:#dce8c5}
.share-message{font-size:13px}.share-message summary{min-height:40px;padding-top:8px}
#share-status{color:#e5f577!important;font-size:12px!important}
.custom-amount-input{background:#002d21;border-color:#73a472;color:#d9e7c5;border-radius:14px}
.custom-amount-input input{color:#fff8df}#amount-error{color:#ffbb9d}
.standings-panel{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}
.standing{text-align:center;min-width:0;padding:14px 8px;border:1px solid #779765;border-radius:18px;background:linear-gradient(#ffffff09,#001e1c60)}
.standing.red{border-top:3px solid #ff7866}.standing.green{border-top:3px solid #8deb76}
.standing canvas{display:block;width:70px;height:auto;aspect-ratio:10/11;margin:0 auto 7px}
.standing h3{font:700 20px/1.1 'Barlow Condensed',sans-serif;margin:0 0 10px}
.standing strong{display:block;font:800 clamp(17px,4.5vw,25px)/1.2 'DM Sans',sans-serif;overflow-wrap:anywhere}
.standing small{display:block;color:#b9d0ae;font-size:11px;margin-top:8px}
dialog .leader-banner{padding:11px;border:1px solid #85a655;border-radius:12px;background:#d6ed7512;color:#e9f6ac;text-align:center;font-weight:700}
#demo-copy{font-size:12px}#demo-copy small{font-size:12px;color:#c7d8ba}
.activity-item{border-color:#3d7151}.activity-item p{font-size:13px}.activity-item small{color:#bdd0b3}.activity-item b{color:#e7f6a5;white-space:nowrap}
.avatar{background:#742e2b;color:#ffe7d3}.bolso .avatar{background:#265c35;color:#e8ffb7}
.rules-list{list-style:none;counter-reset:rules;padding:0;display:grid;gap:10px}
.rules-list li{counter-increment:rules;position:relative;padding:13px 13px 13px 48px;background:#ffffff06;border:1px solid #4e7a56;border-radius:13px;font-size:13px}
.rules-list li:before{content:counter(rules,decimal-leading-zero);position:absolute;left:12px;top:13px;color:#e5f577;font:700 21px 'Barlow Condensed',sans-serif}
.rules-notice{border-left:3px solid #dfef75;padding:8px 12px;background:#d9f5790a}
@media(max-width:600px){dialog,#share-dialog{padding:24px 18px;border-radius:22px;max-height:calc(100dvh - 24px)}dialog h2,#share-dialog h2{font-size:29px;margin-top:18px}.share-layout{gap:18px}.share-preview{width:210px}.share-controls select,#share-nickname,.share-controls textarea{font-size:16px}.share-link-actions{gap:8px}.share-controls>.share-primary,.share-controls>.share-secondary{min-height:48px}.standing canvas{width:60px}.standing h3{font-size:18px}.standing strong{font-size:18px}}
.package-intro{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;color:#eef5cb}
.package-intro strong{font:700 15px 'Barlow Condensed',sans-serif;letter-spacing:.6px}.package-intro span{font-size:14px;font-weight:700}.package-intro small{font-size:11px;color:#c3d7ae}
.package-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:22px 0 16px}
.package-options button{min-width:0;display:flex;flex-direction:column;align-items:center;gap:12px;background:#003c2b;border:1px solid #74a56c;border-radius:16px;padding:18px 6px;color:#fff8df;min-height:150px}
.package-options button strong{font:700 23px/1.1 'Barlow Condensed',sans-serif}.package-options button>span{color:#dcec9c;font-weight:700;font-size:14px}
.package-options button small{font-size:14px;font-weight:700}.package-options button small span{display:block;font-size:10px;font-weight:400;margin-top:5px}
.package-options button[aria-pressed=true]{background:#e5f577;border-color:#f5ffd5;box-shadow:0 0 0 2px #96b859;color:#083d2b}
.package-options button[aria-pressed=true] strong,.package-options button[aria-pressed=true]>span{color:#083d2b}
#package-summary{border:1px solid #537b54;border-radius:12px;padding:12px;font-weight:600;font-size:13px;min-height:64px}
#package-dialog .package-price-note{font-size:12px;color:#ccddb9}#package-error{color:#ffba9f;font-size:13px}
@media(max-width:600px){.package-intro{gap:3px}.package-intro strong{font-size:13px}.package-intro span{font-size:13px}.package-options{gap:7px}.package-options button{padding:15px 4px}.package-options button strong{font-size:20px}.package-options button small{font-size:12px}.package-options button>span{font-size:12px}}
.quick-package-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.quick-package-options button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;min-width:0;min-height:52px;padding:7px 4px;border:1px solid #66a27a;border-radius:12px;background:#003e2c;color:#fff8df}
.quick-package-options strong{font:700 16px/1.1 'Barlow Condensed',sans-serif;white-space:nowrap}
.quick-package-options small{font:600 12px/1.2 'DM Sans',sans-serif}
.quick-package-options button[aria-pressed=true]{background:#e5f577;color:#103d2b;border-color:#efffb6;box-shadow:inset 0 0 0 1px #efffb6}
.quick-package-options button:hover{border-color:#e9f7ac}
@media(max-width:600px){.quick-packages{width:100%}.quick-package-options button{min-height:51px}.quick-package-options strong{font-size:17px}.quick-package-options small{font-size:12px}}
.game-header #sound-open{position:fixed;right:25px;top:108px;display:grid;place-items:center;background:#003320e8;border:1px solid #94c69880;border-radius:10px;color:#eff6d8;width:36px;height:36px}
.sound-option{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px;border-bottom:1px solid #578360;padding:14px 0;font-weight:700}
.sound-option small{display:block;font-size:12px;font-weight:400;color:#c9d8b6;margin-top:5px}.sound-option input{width:24px;height:24px;accent-color:#dcec75;flex-shrink:0}
@media(max-width:600px){.game-header #sound-open{top:150px;left:47px;right:auto;width:32px;height:28px;border-radius:8px}.game-header #sound-open svg{width:17px;height:17px}}
#checkout-dialog{position:fixed;isolation:isolate;text-align:center;overflow-x:hidden}
.checkout-athlete canvas{width:75px;height:auto;aspect-ratio:10/11;display:block;margin:15px auto 0;filter:drop-shadow(0 3px 3px #001e1b)}
#checkout-dialog h2{margin:12px 24px;line-height:1.1}
.checkout-receipt{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0;text-align:left}
.checkout-receipt>span{border:1px solid #669462;border-radius:14px;padding:14px;background:#002d2160;font-size:12px;color:#c8dcb8}
.checkout-receipt strong{display:block;margin-top:8px;font:700 25px 'Barlow Condensed',sans-serif}
.pix-preview{display:flex;align-items:center;flex-direction:column;gap:9px;padding:20px 12px;background:#ffffff05;border:1px dashed #799c69;border-radius:15px}
.pix-preview svg{width:36px;height:36px;color:#e8f577}.pix-preview strong{font-size:14px}.pix-preview small,.checkout-note{font-size:12px;line-height:1.5;color:#c4d7b4}
#checkout-dialog .pix-button{font-size:22px;padding:10px 8px;line-height:1.15;min-height:50px}
.checkout-secondary{display:block;width:100%;background:transparent;border:1px solid #629166;border-radius:14px;color:#f1f3d7;font-weight:600;min-height:44px;margin:12px 0}
.success-medal{display:grid;place-items:center;width:66px;height:66px;border:2px solid #ebf9a5;border-radius:50%;background:linear-gradient(#deed72,#89bd4a);color:#053d2b;font-size:36px;font-weight:800;margin:20px auto;box-shadow:0 0 28px #c3ef6030}
#checkout-error{color:#ffbd9f;font-size:13px}#checkout-error:empty{display:none}
#celebration{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:24px;z-index:-1}
#celebration i{position:absolute;top:-20px;left:var(--x);width:7px;height:13px;opacity:0;animation:arena-confetti 1.5s var(--delay) ease-out both}
@keyframes arena-confetti{0%{opacity:0;transform:translate(0,0) rotate(0)}10%{opacity:.9}100%{opacity:0;transform:translate(var(--drift),560px) rotate(540deg)}}
@media(prefers-reduced-motion:reduce){#celebration i{animation:none;display:none}}
#share-dialog{max-width:680px}
#share-dialog h2{font-size:30px;margin:8px 32px 8px 0}
#share-dialog .share-modal-heading>p{margin-bottom:20px;font-size:14px}
#share-dialog .share-layout{grid-template-columns:180px minmax(0,1fr);gap:24px;align-items:center}
#share-dialog .share-preview{position:static;width:180px;margin:0 auto;padding:6px}
#share-dialog .share-controls>button{width:100%;min-height:48px;font-size:14px;margin-bottom:10px}
#share-status:empty{display:none}
#share-copy-fallback{width:100%;padding:12px;background:#002d21;border:1px solid #84a768;border-radius:8px;color:#fff8df;font-size:16px}
@media(max-width:600px){#share-dialog .share-layout{grid-template-columns:1fr;gap:16px}#share-dialog .share-preview{width:132px}#share-dialog h2{font-size:27px}#share-dialog .share-modal-heading>p{font-size:13px;margin-bottom:14px}#share-dialog .share-controls>button{min-height:44px;margin-bottom:8px}}
.impulse-award{position:relative;display:flex;flex-direction:column;align-items:center;margin:16px 0 12px;padding:12px 0;color:#efff83;isolation:isolate}
#impulse-ribbon{background:#153f2b;border:1px solid #8ea953;border-radius:8px;padding:6px 18px;font:800 15px 'Barlow Condensed',sans-serif;letter-spacing:1.4px;color:#fff4cf}
#impulse-distance{font:800 86px/.95 'Barlow Condensed',sans-serif;color:#ebfa69;text-shadow:0 3px 0 #1d682c,0 0 25px #e8fa5330;margin-top:12px}
#impulse-unit{font:700 18px 'Barlow Condensed',sans-serif;letter-spacing:4px;margin-top:4px;color:#f1f4d0}
.impulse-approved .checkout-athlete{position:relative;isolation:isolate}
.impulse-approved .checkout-athlete:before{content:'';position:absolute;inset:-14px calc(50% - 66px);z-index:-1;border-radius:50%;background:radial-gradient(circle,#edfa6870,#67d45430 45%,transparent 70%);animation:athlete-glow 1.2s ease-out both}
.impulse-approved .checkout-athlete canvas{animation:athlete-pop .55s cubic-bezier(.2,.8,.2,1) both}
.impulse-approved .impulse-award{animation:impulse-impact .65s cubic-bezier(.2,.8,.2,1) both}
.impulse-streaks{position:absolute;inset:20% 0;z-index:-1;overflow:hidden;pointer-events:none}
.impulse-streaks i{position:absolute;height:2px;width:45%;left:-50%;top:30%;background:linear-gradient(90deg,transparent,#dcf16a,transparent);opacity:0;animation:impulse-sweep .8s .15s ease-out both}
.impulse-streaks i:nth-child(2){top:55%;animation-delay:.28s}.impulse-streaks i:nth-child(3){top:80%;animation-delay:.4s}
[data-tier="1"] .impulse-streaks{display:none}
[data-tier="10"].impulse-approved .impulse-award:before{content:'';position:absolute;inset:-20px 8%;z-index:-2;background:radial-gradient(ellipse,#d9f44d45,transparent 70%);animation:athlete-glow 1.4s ease-out both}
[data-overtake="true"] #impulse-ribbon{background:#e5f577;color:#073827;font-size:23px;padding:6px 30px;transform:rotate(-3deg);box-shadow:0 3px 0 #6c9239}
@keyframes athlete-pop{from{transform:translateY(8px) scale(.85);opacity:.6}to{transform:translateY(0) scale(1);opacity:1}}
@keyframes impulse-impact{0%{transform:scale(.78);opacity:0}65%{transform:scale(1.06);opacity:1}100%{transform:scale(1);opacity:1}}
@keyframes athlete-glow{0%{opacity:0;transform:scale(.6)}35%{opacity:1;transform:scale(1.08)}100%{opacity:.55;transform:scale(1)}}
@keyframes impulse-sweep{0%{transform:translateX(0);opacity:0}25%{opacity:.75}100%{transform:translateX(350%);opacity:0}}
@media(max-width:600px){#impulse-distance{font-size:72px}.impulse-award{margin:10px 0;padding:8px 0}.impulse-approved .checkout-athlete canvas{width:67px}}
@media(prefers-reduced-motion:reduce){.impulse-approved .checkout-athlete:before,.impulse-approved .checkout-athlete canvas,.impulse-approved .impulse-award,[data-tier="10"].impulse-approved .impulse-award:before{animation:none}.impulse-streaks{display:none}}


.quick-package-options button{position:relative}
#donation-form .pix-button #submit-copy{white-space:normal;line-height:1.1}
@media(max-width:600px){#donation-form .pix-button{font-size:clamp(19px,5.8vw,25px)}#donation-form .pix-button .pix-logo{width:24px;flex-shrink:0}}

.quick-package-options .package-badge{position:absolute;top:-9px;left:50%;transform:translateX(-50%);display:block;white-space:nowrap;border:2px solid #315b36;border-radius:6px;background:#e5f577;color:#103d2b;padding:3px 7px;font:800 10px/1 'Barlow Condensed',sans-serif;letter-spacing:.35px;text-transform:uppercase}
.quick-package-options button:has(.package-badge){border-color:#d4e781}

.hud .score-value{font-family:'Barlow Condensed',sans-serif;font-size:27px;letter-spacing:.4px;line-height:1.25;margin-top:5px}.hud .score-value.is-leading{color:#e5f577}
@media(max-width:600px){.hud .score-value{font-size:17px;letter-spacing:0}.hud .portrait{bottom:0}}
@media(max-width:360px){.hud .score-value{font-size:14px}}

#demo-toggle[hidden]{display:none!important}.form-error{color:#ffe1aa}

/* Pix checkout shares the arena's panel palette; the QR keeps its required white quiet zone. */
#pix-payer:not([hidden]),#pix-charge:not([hidden]){display:grid;gap:14px;margin:18px 0;text-align:left}
#pix-payer label,#pix-charge label{display:grid;gap:6px;font:600 15px system-ui;color:#fff5d4}
#pix-payer input,#pix-code{width:100%;min-width:0;box-sizing:border-box;padding:12px;border:1px solid #6ea584;border-radius:12px;background:#002d22;color:#fff7da;font:16px system-ui}
#pix-payer small,#pix-charge small{color:#c8d9bd;font:13px/1.5 system-ui}
#pix-qr{max-width:100%;height:auto;justify-self:center;border-radius:12px}
#pix-status{text-align:center;color:#ecff80;font:600 16px/1.4 system-ui}
#pix-code{font-size:12px}#pix-payer .pix-button,#pix-charge .pix-button{font-size:24px}

.payment-reference{display:block;margin-top:12px;font-size:10px;color:#d5e6c5;overflow-wrap:anywhere;text-align:center}
