/* Arena presentation; shared navigation and machine controls remain unchanged. */
#arena-page .arena-heading{justify-content:flex-start;flex-wrap:nowrap}
.arena-versus>span{display:flex;flex-direction:column;align-items:center;gap:8px}
#arena-page .arena-player-avatar{position:relative;display:block;width:64px;height:64px;flex:none;border-radius:50%;border:0;box-shadow:none;margin:5px;overflow:visible}
#arena-page .arena-player-avatar>img{display:block;width:100%;height:100%;object-fit:contain;border-radius:50%}
#arena-page .arena-player-avatar:after{content:'';position:absolute;inset:-9px;background:url('/game/platform-art/arena-ui-v1/09-avatar-frame-universal-v2.png') center/contain no-repeat;pointer-events:none}
body.platform-enabled.arena-selecting{background:#fffaf3;color:#060758;color-scheme:light}
body.arena-selecting>.notification-checkin-toast{display:none!important}
body.arena-selecting #arena-page .arena-heading{height:100px;min-height:100px}
#arena-page .arena-fee>img{display:inline-block}
#arena-page small{letter-spacing:normal}
#arena-page .arena-queue>.arena-secondary{width:auto}
#arena-page .arena-entry .arena-go>span:not(.claw-system-face){font-size:0;width:10px;height:16px;background:url('/game/platform-art/arena-ui-v1/31-chevron.png') center/contain no-repeat}
.claw-platform.platform-shell>#arena[data-platform-page]{width:100%;max-width:960px;padding:0;margin:0 auto}
#arena-page{--arena-muted:#777295;color:#080953;font:16px/1.5 ClawSystemLocal,system-ui,sans-serif;font-synthesis:none;position:relative;padding-bottom:20px}
#arena-page [hidden],#arena-page[hidden],#arena-room-hud[hidden]{display:none!important}
#arena-page *{box-sizing:border-box}#arena-page img{object-fit:contain;max-width:100%}
#arena-page h1,#arena-page h2,#arena-page h3,#arena-page p{margin:0;font-weight:400}
#arena-page button,#arena-surrender-dialog button{font:inherit;cursor:pointer;touch-action:manipulation}
#arena-page button:focus-visible,#arena-room-hud button:focus-visible{outline:3px solid #7963cf;outline-offset:4px}
#arena-page button:disabled{cursor:default;filter:grayscale(.65);opacity:.55}
#arena-page .arena-heading{height:160px;display:flex;flex-direction:column;align-items:center;padding:24px 0 12px;gap:10px}
#arena-page .arena-heading h1{height:54px;display:grid;place-items:center}#arena-page .arena-heading h1 img{width:206px;height:55px}.arena-heading p{font-size:16px}
.arena-layout{display:grid;grid-template-columns:290px minmax(0,1fr);gap:16px}
#arena-page .arena-card{border:1px solid #f1ebf5;border-radius:24px;background:#ffffffeb;box-shadow:0 8px 25px #4d32670b;min-width:0}
#arena-page .arena-rank{display:flex;flex-direction:column;align-items:center;text-align:center;padding:18px;background:#fff url('/game/platform-art/arena-ui-v1/17-rank-card-glow-v4.png') center 38px/290px auto no-repeat}
.arena-rank h2{display:flex;align-items:center;gap:7px;font-size:18px}.arena-rank h2 img{width:24px;height:24px}
#arena-page .arena-rank-art{width:220px;height:220px;margin:8px auto 0;filter:drop-shadow(0 10px 12px #bd9fc728)}
.arena-rank-copy{width:100%}#arena-page .arena-rank h3{font-size:24px;margin:2px 0 6px}
.arena-stars{display:flex;justify-content:center;align-items:center;gap:6px;min-height:32px;flex-wrap:wrap}.arena-stars img{width:30px;height:30px}
.arena-record{display:flex;background:#f3f1ffb0;border-radius:16px;margin:14px 0 6px;padding:10px 4px}.arena-record>span{flex:1;font-size:14px}.arena-record>span+span{border-left:1px solid #ddd4f5}.arena-record strong{display:block;font-size:27px;font-weight:400;line-height:1.3}
.arena-rank small{display:block;font-size:12px;color:var(--arena-muted);line-height:1.6}.arena-link{border:0;background:none;color:#6450af;text-decoration:underline;text-underline-offset:4px;min-height:44px;padding:8px}
.arena-feature{padding:12px;display:flex;flex-direction:column;gap:12px}.arena-scene{position:relative;isolation:isolate;overflow:hidden;border-radius:17px;min-height:265px;flex:1;background:#bfe5fb}
#arena-page .arena-scene-image{position:absolute;width:100%;height:100%;object-fit:cover;inset:0;z-index:-2}.arena-scene:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#edf7ffed 0%,#eff7ff90 36%,#eaf5ff00 70%)}
.arena-scene-copy{padding:22px 18px}.arena-mode{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(#be94f4,#9472d5);border:1px solid #f3e7ff;border-radius:10px;padding:4px 10px;color:#fff;box-shadow:inset 0 1px 3px #fff9;font-size:14px}.arena-mode img{width:26px;height:26px}
#arena-page .arena-scene h2{font-size:34px;margin:16px 0 12px;letter-spacing:2px}.arena-scene p{font-size:15px;line-height:1.65;text-shadow:0 1px 8px white}
.arena-benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.arena-benefits>div{display:flex;gap:5px;align-items:center;justify-content:center;padding:10px 4px;background:#fcf5f3;border-radius:13px;font-size:14px}.arena-benefits img{width:38px;height:44px;flex-shrink:0}.arena-benefits small,.arena-how small{display:block;color:var(--arena-muted);font-size:11px;line-height:1.6;margin-top:3px}.arena-target-preview{display:contents}
.arena-entry{display:flex;align-items:center;gap:15px;padding:4px 0}
#arena-page .arena-go,#arena-page .arena-secondary{display:flex;align-items:center;justify-content:center;gap:12px;border:0;color:#fff;background:transparent url('/game/platform-art/arena-ui-v1/15-primary-button-skin-v4.png') center/100% 100% no-repeat;min-height:47px;padding:8px 20px;font-size:18px;transition:filter .15s,transform .15s}
#arena-page .arena-go:not(:disabled):hover{filter:brightness(1.06);transform:translateY(-1px)}#arena-page .arena-secondary{background-image:url('/game/platform-art/arena-ui-v1/16-secondary-button-skin-v4.png');color:#6450a4;font-size:15px;min-height:44px}.arena-entry .arena-go{flex:1;max-width:350px}
.arena-fee{flex-shrink:0;font-size:14px;line-height:1.4;text-align:center}.arena-fee>img{width:32px;height:32px;vertical-align:middle;margin-right:4px}.arena-fee strong{font-size:28px;font-weight:400;vertical-align:middle}.arena-fee small{display:block;font-size:11px;color:var(--arena-muted);margin-top:3px}
.arena-how{margin-top:16px;padding:15px 20px}#arena-page .arena-how h2{font-size:18px;margin-bottom:12px}.arena-how ol{list-style:none;counter-reset:steps;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding:0;margin:0;gap:18px}.arena-how li{counter-increment:steps;display:flex;align-items:center;gap:10px;font-size:16px}.arena-how li:before{content:counter(steps);background:#e5d5fb;color:#7d4bb9;border-radius:50%;width:28px;height:28px;display:grid;place-items:center;flex-shrink:0}.arena-how li>img,.arena-how li>span>img{width:45px;height:45px}.arena-how li>span:has(img){display:contents}
.arena-queue{display:flex;align-items:center;justify-content:center;gap:16px;padding:10px;background:#f7f2ff;border-radius:16px}.arena-search-art{position:relative;width:54px;height:54px;flex-shrink:0}.arena-search-art img{width:54px;height:54px}.arena-spin{position:absolute;inset:-5px;border:2px solid #e0d4f2;border-top-color:#a280d8;border-radius:50%;animation:arena-spin 1.4s linear infinite}#arena-page .arena-queue h3{font-size:18px}.arena-queue p{font-size:12px;color:var(--arena-muted)}.is-queued .arena-entry{display:none}@keyframes arena-spin{to{transform:rotate(360deg)}}
.arena-tier-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;text-align:center;width:100%}.arena-tier-list>div{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:14px}.arena-tier-list img{width:90px;height:90px;object-fit:contain}
#arena-page .arena-selection{max-width:720px;margin:0 auto;padding:24px 30px;text-align:center}.arena-eyebrow{font-size:13px;color:#8761bf;letter-spacing:2px}#arena-page .arena-match-heading h2{font-size:25px;margin:6px 0}.arena-match-heading p,.arena-help{font-size:13px;color:var(--arena-muted)}
.arena-versus{display:flex;align-items:center;justify-content:center;gap:20px;margin:18px 0}.arena-versus>span{flex:1;max-width:190px;overflow-wrap:anywhere;padding:12px;border:1px solid #e6dcf5;background:#f7f3fc;border-radius:14px}.arena-versus>span:last-child{background:#fff3f7;border-color:#f8dbe5}.arena-versus>img{width:64px;height:42px}
.arena-select-line{display:flex;align-items:center;justify-content:center;gap:14px;margin:8px 0}#arena-page .arena-select-line h3{font-size:17px}.arena-countdown{color:#e84c77;background:#fff0f4;border-radius:999px;padding:4px 12px;min-width:64px;font-variant-numeric:tabular-nums}
.arena-picks{display:flex;justify-content:center;gap:14px;margin:12px 0}.arena-picks button{position:relative;width:90px;height:90px;border:2px dashed #cdbce9;border-radius:18px;background:#f9f5ff;color:#b3a2cf;font-size:28px!important;padding:5px}.arena-picks button.is-picked{border-style:solid;border-color:#b39add;background:#fff}.arena-picks img{width:100%;height:100%}
.arena-pool{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin:16px 0}.arena-pool button{aspect-ratio:1;border:1px solid #e6dcf2;border-radius:16px;padding:5px;background:linear-gradient(#fff,#f7f2fb)}.arena-pool button:hover:not(:disabled){border-color:#a38ace;box-shadow:0 3px 10px #bda6d633}.arena-pool img{display:block;width:100%;height:100%}.arena-selection>.arena-go{width:280px;max-width:100%;margin:12px auto 0}[data-a="select-status"]{min-height:22px;margin-top:8px!important;font-size:13px;color:#776389}
#arena-page .arena-result{text-align:center;max-width:650px;margin:0 auto;padding:24px 32px}.arena-result-art{display:block;width:150px;height:150px;margin:8px auto;background:url('/game/platform-art/arena-ui-v1/17-rank-card-glow-v4.png') center/contain no-repeat}#arena-page .arena-result h2{font-size:36px;color:#ec5277}#arena-page[data-outcome="loss"] .arena-result h2{color:#7e75a0}.arena-result-score{font-size:32px;letter-spacing:10px;margin:8px 0}[data-a="result-detail"]{font-size:14px;color:var(--arena-muted)}
.arena-result-rewards{display:flex;justify-content:center;gap:20px;margin:16px 0;padding:12px;border-radius:16px;background:#fff7ec}.arena-result-rewards p{display:flex;align-items:center;gap:6px;font-size:16px}.arena-result-rewards img{width:30px;height:30px}.arena-result-targets{display:flex;justify-content:center;gap:22px;margin:16px 0}.arena-result-actions{display:flex;justify-content:center;gap:12px}.arena-result-actions>*{flex:1;max-width:250px}.arena-error{min-height:24px;text-align:center;color:#b43f52;font-size:14px;margin-top:8px!important}
.arena-side{min-width:0}.arena-side>b{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12px;font-weight:400;margin-bottom:4px}.arena-side>b>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:110px}.arena-side strong{font-size:17px;font-weight:400;color:#8853bd}.arena-side>div{display:flex;gap:5px}.arena-side>div>span{position:relative;display:block;width:44px;height:52px;border:1px solid #e2d6ef;border-radius:10px;background:#fff;padding-bottom:12px}.arena-side img{width:100%;height:100%;object-fit:contain}.arena-side small{position:absolute;left:0;right:0;bottom:1px;font-size:9px;text-align:center;color:#80718b;line-height:1.2}.arena-side .done{background:#edf9f3;border-color:#a5cfbc}.arena-side .done:after{content:'✓';position:absolute;right:-3px;top:-4px;width:16px;height:16px;border-radius:50%;background:#468e71;color:white;font:11px/16px system-ui;text-align:center}
#arena-room-hud{position:absolute;left:50%;transform:translateX(-50%);top:70px;z-index:3;display:flex;align-items:center;gap:10px;padding:8px 12px;border:1px solid #ffffffbd;border-radius:18px;background:#fffcf5eb;box-shadow:0 4px 18px #23114418;color:#080953;font:13px/1.4 ClawSystemLocal,system-ui,sans-serif;max-width:calc(100% - 24px)}.arena-hud-vs{font:italic 16px system-ui;color:#df7498}#arena-room-hud .is-turn>b{color:#bb4d86}#arena-room-hud button{min-height:44px;border:0;border-left:1px solid #dfd2e9;background:transparent;color:#8f7394;padding:4px 0 4px 10px;font:12px ClawSystemLocal,system-ui;cursor:pointer}
#arena-surrender-dialog{max-width:calc(100% - 32px);border:1px solid #efe4f4;border-radius:20px;padding:24px;background:#fffdf8;color:#080953;font:16px/1.6 ClawSystemLocal,system-ui,sans-serif}#arena-surrender-dialog::backdrop{background:#25163566}#arena-surrender-dialog div{display:flex;gap:12px;justify-content:flex-end}#arena-surrender-dialog button{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid #d7caff;background:#fff;color:#080953}#arena-surrender-dialog [data-s="yes"]{border:0;background:#f45b7e;color:#fff}
body.playing-view.arena-selecting{overflow:auto!important;height:auto!important}body.playing-view.arena-selecting>#platform-shell{display:block!important}body.playing-view.arena-selecting>.platform-header.claw-platform:not(#room){display:flex!important}body.arena-selecting>#room{position:fixed!important;inset:0!important;z-index:-1!important;opacity:0;pointer-events:none}
body.arena-play #room#room#room #start,body.arena-play #room#room#room #coin-status,body.arena-play #room#room#room .game-actions #release{display:none!important}body.arena-play #room#room.liquid-hud .game-actions:after,body.arena-play #room#room .game-actions:after{display:none!important}

@media(max-width:760px){
 #arena-page .arena-heading{height:138px;padding-top:22px;gap:8px}#arena-page .arena-heading h1{height:40px}#arena-page .arena-heading h1 img{width:150px;height:40px}#arena-page .arena-heading p{font-size:14px}
 .arena-layout{grid-template-columns:minmax(0,1fr);gap:14px}#arena-page .arena-rank{flex-direction:row;flex-wrap:wrap;align-items:center;padding:12px 16px;gap:4px 14px;text-align:left;background-size:180px;background-position:-10px center}.arena-rank h2{width:100%;font-size:15px}.arena-rank h2 img{width:20px;height:20px}#arena-page .arena-rank-art{width:100px;height:112px;margin:0}.arena-rank-copy{flex:1;min-width:0}#arena-page .arena-rank h3{font-size:20px;margin:0 0 3px}.arena-stars{justify-content:flex-start;gap:3px;min-height:24px}.arena-stars img{width:22px;height:22px}.arena-record{margin:5px 0;padding:4px 0;background:none;gap:10px}.arena-record>span{font-size:11px;display:flex;gap:6px;align-items:center}.arena-record>span+span{border:0}.arena-record strong{font-size:18px}.arena-rank small{font-size:10px}.arena-rank [data-a="record"]{display:none}.arena-rank .arena-link{padding:3px 0;min-height:44px;font-size:12px}
 .arena-feature{padding:10px;gap:10px}.arena-scene{min-height:220px}.arena-scene-copy{padding:16px 12px}#arena-page .arena-scene h2{font-size:29px;margin:12px 0}.arena-scene p{font-size:13px}.arena-mode{font-size:12px}.arena-mode img{width:22px;height:22px}.arena-benefits>div{flex-direction:column;gap:2px;text-align:center;font-size:12px;padding:8px 2px}.arena-benefits img{width:34px;height:36px}.arena-benefits small{font-size:9px}
 .arena-entry{padding:0;gap:10px}.arena-entry .arena-go{font-size:17px!important;min-width:0;padding:8px!important}.arena-fee{font-size:12px}.arena-fee strong{font-size:23px}.arena-fee>img{width:24px;height:24px}.arena-fee small{font-size:9px}.arena-how{padding:14px!important}.arena-how ol{grid-template-columns:1fr;gap:14px}.arena-how li{font-size:14px}.arena-how small{font-size:12px}.arena-queue{flex-wrap:wrap;gap:12px}.arena-queue>.arena-secondary{width:100%}
 #arena-page .arena-selection,#arena-page .arena-result{padding:18px 14px}#arena-page .arena-match-heading h2{font-size:22px}.arena-match-heading p,.arena-help{font-size:12px}.arena-versus{gap:10px;margin:12px 0}.arena-versus>span{font-size:14px;padding:10px 5px}.arena-versus>img{width:44px;height:30px}.arena-pool{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.arena-picks button{width:72px;height:72px}.arena-result-art{width:120px;height:120px}.arena-result-rewards{gap:12px}.arena-result-rewards p{font-size:14px}.arena-result-actions{flex-direction:column;align-items:stretch}.arena-result-actions>*{max-width:none}
 #arena-room-hud{top:62px;gap:6px;padding:6px 8px}.arena-side>div>span{width:36px;height:44px}.arena-side>b{font-size:11px}.arena-side strong{font-size:14px}.arena-side small{font-size:8px}
}
@media(max-width:350px){.arena-entry{flex-direction:column}.arena-entry .arena-go{width:100%}.arena-fee small{display:inline;margin-left:6px}.arena-benefits small{font-size:8px}.arena-rank-art{width:80px!important}.arena-record{gap:4px}.arena-record>span{gap:3px}.arena-side>div>span{width:32px}}
@media(orientation:landscape) and (max-height:500px){#arena-room-hud{left:12px;transform:none;top:64px;gap:6px;padding:5px 8px}.arena-side>div>span{width:32px;height:38px}.arena-side small{font-size:8px}.arena-side>b{font-size:10px}.arena-side strong{font-size:13px}}
@media(prefers-reduced-motion:reduce){.arena-spin{animation:none}#arena-page button{transition:none!important}}
@media(max-width:640px){
 body.playing-view.arena-selecting>.platform-header.claw-platform:not(#room){display:grid!important}
 body.arena-selecting #arena-page .arena-heading{height:70px;min-height:70px;padding:12px 0}
 body.arena-selecting #arena-page .arena-heading p{display:none}
 #arena-page .arena-player-avatar{width:48px;height:48px}
 #arena-page .arena-selection{padding:14px 12px}
 .arena-selection .arena-versus{margin:8px 0}.arena-selection .arena-versus>span{padding:8px 4px;gap:4px}
 .arena-selection .arena-picks{margin:8px 0}.arena-selection .arena-picks button{width:56px;height:56px}
 .arena-selection .arena-pool{margin:10px 0;gap:6px}
}
@media(min-width:360px) and (max-width:640px){.arena-selection .arena-pool{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:760px){
 body.arena-play #arena-room-hud{top:78px}

}
@media(orientation:landscape) and (max-height:500px){}
/* Match lobby entry buttons; platform-system-dom supplies the shared face. */
#arena-page .arena-entry .claw-system-face img{object-fit:fill}
#arena-page .arena-entry .arena-go.platform-enter{position:relative;flex:0 0 116px;width:116px;max-width:116px;height:47px;min-height:44px;padding:0!important;border:0;border-radius:12px;background:transparent;overflow:visible;line-height:1.2;letter-spacing:0;text-shadow:none;transition:filter .15s,transform .15s}
#arena-page .arena-entry .arena-go.platform-enter:not(:disabled):hover{filter:brightness(1.04);transform:none}
#arena-page .arena-entry .arena-go.platform-enter:not(:disabled):active{transform:translateY(1px)}
#arena-page .arena-entry .arena-go.platform-enter:disabled{cursor:not-allowed;filter:grayscale(1);opacity:.6}
@media(max-width:800px){#arena-page .arena-entry .arena-go.platform-enter{flex-basis:105px;width:105px;max-width:105px;height:44px;min-height:44px;border-radius:10px}}
@media(max-width:350px){#arena-page .arena-entry .arena-go.platform-enter{flex-basis:auto}}
/* Keep the entry fee at the right edge, separated from the match action. */
#arena-page .arena-entry{flex-direction:row}
#arena-page .arena-entry .arena-fee{margin-left:auto;padding-left:20px;border-left:1px solid #d8cbe8;text-align:center;min-width:0}
#arena-page .arena-entry .arena-fee small{display:block;margin-left:0}
@media(max-width:800px){#arena-page .arena-entry .arena-fee{padding-left:12px}}
/* Reference feature card: wide close-up scene and clearer information hierarchy. */
#arena-page .arena-feature{justify-content:flex-start;gap:14px}
#arena-page .arena-scene{flex:1 0 auto;aspect-ratio:2.1;min-height:0}
#arena-page .arena-scene:after{background:linear-gradient(90deg,#effaffc9 0%,#effaff70 30%,#effaff00 55%)}
#arena-page .arena-scene-copy{padding:22px 20px}
#arena-page .arena-mode{font-size:17px;padding:5px 12px;border-radius:12px}
#arena-page .arena-mode img{width:28px;height:28px}
#arena-page .arena-scene h2{font-size:42px;line-height:1.25;letter-spacing:1px;margin:16px 0 24px}
#arena-page .arena-scene p{font-size:16px;line-height:1.65}
#arena-page .arena-benefits{gap:9px}
#arena-page .arena-benefits>div{padding:12px 6px;gap:8px;font-size:16px;min-height:74px;background:linear-gradient(135deg,#fff9f4,#fcf3ef)}
#arena-page .arena-benefits img{width:46px;height:50px}
#arena-page .arena-benefits small{font-size:11px}
#arena-page .arena-entry{padding-top:0;padding-bottom:0}
@media(max-width:950px) and (min-width:761px){#arena-page .arena-scene{aspect-ratio:auto;min-height:290px}#arena-page .arena-benefits>div{flex-direction:column;text-align:center}}
@media(max-width:760px){
 #arena-page .arena-feature{gap:10px}
 #arena-page .arena-scene{aspect-ratio:auto;min-height:260px}
 #arena-page .arena-scene-image{object-position:62% center}
 #arena-page .arena-scene-copy{padding:18px 14px}
 #arena-page .arena-mode{font-size:13px;padding:4px 8px}
 #arena-page .arena-mode img{width:24px;height:24px}
 #arena-page .arena-scene h2{font-size:34px;margin:14px 0 20px}
 #arena-page .arena-scene p{font-size:14px}
 #arena-page .arena-benefits{gap:6px}
 #arena-page .arena-benefits>div{padding:8px 2px;gap:3px;font-size:12px;min-height:96px}
 #arena-page .arena-benefits img{width:40px;height:42px}
 #arena-page .arena-benefits small{font-size:9px}
}
@media(max-width:350px){#arena-page .arena-benefits small{font-size:8px}}
.arena-mobile-hint{display:none}
#arena-page .arena-mobile-state{text-align:center;padding:24px 18px;max-width:480px;margin:0 auto}
#arena-page .arena-mobile-state h2{font-size:28px;line-height:1.3;margin-bottom:12px}
#arena-page .arena-mobile-state h3{font-size:24px}
.arena-state-subtitle{font-size:14px;color:#746297;margin:10px 0!important}
.arena-pair{display:grid;grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr);align-items:center;gap:8px;margin:28px 0}
.arena-pair>div{min-width:0;display:flex;flex-direction:column;align-items:center;gap:12px}
#arena-page [data-a="search"] .arena-pair>div{gap:8px}
#arena-page .arena-pair .arena-player-avatar{width:96px;height:96px;margin:12px}
#arena-page .arena-pair .arena-player-avatar:after{inset:-14px}
.arena-pair-vs{width:40px;height:46px}.arena-pair-dots{color:#a274f1;font-size:24px;letter-spacing:3px}
.arena-player-rank{display:flex;align-items:center;justify-content:center;gap:5px;font-size:16px}
.arena-player-rank img{width:42px;height:52px}
.arena-unknown-avatar{width:112px;height:112px;display:grid;place-items:center;border:2px dashed #bf9afb;border-radius:50%;background:radial-gradient(#e9ddff,#f9f6ff);color:#ad8cde;font-size:50px}
.arena-state-note{display:flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(110deg,#fcfaff,#f0ecff);padding:12px 8px;border-radius:14px;font-size:12px;margin:16px 0!important}
.arena-state-note img{width:32px;height:32px}.arena-state-note strong{font-size:24px;font-weight:400}
#arena-page .arena-mobile-state>.arena-secondary{width:100%;min-height:52px;font-size:20px}
#arena-page .arena-state-scene{display:block;width:100%;height:150px;object-fit:cover;border-radius:18px;margin-top:12px}
#arena-page [data-a="entering"] .arena-state-scene{height:250px;object-position:70% center}
.arena-load-steps{list-style:none;text-align:left;padding:10px 0;margin:16px auto;width:max-content;max-width:100%}
.arena-load-steps li{position:relative;display:flex;align-items:center;gap:14px;min-height:52px;color:#8c85a8}
.arena-load-steps li:before{content:'';width:24px;height:24px;border:2px solid #cec4e8;border-radius:50%;background:#e9e4f4;z-index:1}
.arena-load-steps li+li:after{content:'';position:absolute;left:12px;top:-13px;height:25px;border-left:3px dotted #cdb2ee}
.arena-load-steps li.is-complete{color:#10095d}.arena-load-steps li.is-complete:before{content:'✓';display:grid;place-items:center;color:#fff;background:#a36bf5;border-color:#c19cff}
#arena-page progress{width:100%;height:13px;appearance:none;border:0;border-radius:12px;overflow:hidden;background:#ede6ff}
#arena-page progress::-webkit-progress-bar{background:#ede6ff}#arena-page progress::-webkit-progress-value{background:linear-gradient(90deg,#9358ef,#c5a4ff);border-radius:12px}
@media(max-width:760px){
 #arena-page .arena-heading{height:100px;min-height:100px;padding:12px 0;gap:4px}
 #arena-page .arena-heading h1 img{width:166px;height:44px}
 #arena-page .arena-rank{display:grid;grid-template-columns:42% minmax(0,1fr);grid-template-rows:24px auto;gap:0 8px;padding:12px;background-position:left center}
 #arena-page .arena-rank h2{grid-column:2;grid-row:1;font-size:14px}
 #arena-page .arena-rank-art{grid-column:1;grid-row:1 / 3;width:100%!important;height:162px}
 #arena-page .arena-rank-copy{grid-column:2;grid-row:2}
 #arena-page .arena-rank h3{font-size:25px;margin:4px 0 8px}
 #arena-page .arena-stars img{width:24px;height:24px}
 #arena-page .arena-record{gap:8px;margin-top:10px}
 #arena-page .arena-rank [data-a="season"]{display:none}
 #arena-page .arena-rank .arena-link{min-height:32px}
 #arena-page .arena-feature{gap:10px;padding:10px}
 #arena-page .arena-scene{overflow:visible;isolation:auto;background:none;min-height:0;aspect-ratio:auto;padding-top:230px;border-radius:18px}
 #arena-page .arena-scene-image{height:230px;object-position:70% center;z-index:auto;border-radius:18px}
 #arena-page .arena-scene:after{display:none}
 #arena-page .arena-scene-copy{padding:0}
 #arena-page .arena-mode{position:absolute;left:10px;top:10px}
 #arena-page .arena-scene h2{text-align:center;font-size:28px;margin:0;padding:3px 0;line-height:1.3}
 #arena-page .arena-scene p,#arena-page .arena-benefits small,#arena-page .arena-how{display:none}
 #arena-page .arena-benefits{gap:5px}
 #arena-page .arena-benefits>div{flex-direction:row;gap:3px;min-height:48px;padding:4px 2px;font-size:10px;background:#f3efff}
 #arena-page .arena-benefits img{width:30px;height:38px}
 #arena-page .arena-entry{flex-direction:column-reverse;gap:12px;padding:0}
 #arena-page .arena-entry .arena-fee{margin:0;padding:0;border:0;text-align:center;font-size:14px}
 #arena-page .arena-fee strong{font-size:32px}
 #arena-page .arena-fee>img{width:36px;height:36px}
 #arena-page .arena-fee small{font-size:10px;margin-top:0}
 #arena-page .arena-entry .arena-go.platform-enter{flex:0 0 52px;width:100%;max-width:none;height:52px;border-radius:12px}
 #arena-page .arena-entry .claw-system-icon{width:116px;left:50%;transform:translateX(-50%)}
 #arena-page .arena-mobile-hint{display:block;background:#f3efff;border-radius:14px;padding:9px 5px;text-align:center;font-size:11px}
 #arena-page .arena-mobile-state{padding:24px 14px;min-height:460px}
 #arena-page [data-a="matched"] .arena-state-scene{height:120px}
 #arena-page [data-a="matched"] .arena-pair{margin:20px 0 10px}
 #arena-page [data-a="search"] .arena-pair{margin:20px 0}
 #arena-page [data-a="intro-left"]{font-size:12px;color:#776292;margin-top:8px}
}
@media(max-width:640px){
 body.arena-mobile-surface.platform-enabled:not(.playing-view)>.claw-platform.platform-header{display:grid!important;grid-template-columns:minmax(80px,1fr) minmax(96px,1.1fr) 30px 30px;grid-template-rows:44px;gap:4px;min-height:58px;height:calc(58px + env(safe-area-inset-top));padding:calc(7px + env(safe-area-inset-top)) 10px 7px}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-brand{width:100%;min-width:0}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-brand-logo,body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-brand-image{width:100%;max-width:125px;height:auto}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-wallet{grid-column:2;grid-row:1;height:34px;width:100%;padding:3px 5px;gap:3px;border:1px solid #ffe3c9;background:#fff8f1;border-radius:20px}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-wallet-skin{display:none}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-wallet .platform-coin-original{width:22px;height:22px}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-wallet .platform-currency-label{font-size:9px}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-wallet strong{font-size:16px}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .notification-anchor{grid-column:3;grid-row:1}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-menu-toggle{grid-column:4;grid-row:1;transform:none}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-header-tool{display:none}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .notification-bell,body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-menu-toggle{display:flex;width:30px;padding:3px}
 body.arena-mobile-surface.arena-selecting #arena-page .arena-heading{height:100px;min-height:100px;padding:12px 0}
 body.arena-mobile-surface.arena-selecting #arena-page .arena-heading p{display:block}
}

@media(max-width:640px){
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-brand-composed{width:100%;max-width:125px;height:40px}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-brand-composed .platform-brand-logo{margin-left:25px;width:calc(100% - 25px);height:40px;max-width:none}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-brand-composed .platform-brand-candy{width:30px;height:30px;left:0}
 body.arena-mobile-surface.platform-enabled:not(.playing-view) .claw-platform .platform-wallet .platform-candy-icon{width:22px;height:22px;flex:none}
}
/* Shared image ornaments keep state titles centered without changing their height. */
#arena-page .arena-mobile-state>h2{display:flex;align-items:center;justify-content:center;gap:10px}
#arena-page .arena-mobile-state>h2::before,#arena-page .arena-mobile-state>h2::after{content:"";display:block;flex:0 0 20px;width:20px;height:30px;background:center/contain no-repeat;pointer-events:none}
#arena-page .arena-mobile-state>h2::before{background-image:url('/game/platform-art/original-ui/spark-left.png')}
#arena-page .arena-mobile-state>h2::after{background-image:url('/game/platform-art/original-ui/spark-right.png')}
@media(min-width:761px){#arena-page .arena-mobile-state>h2::before,#arena-page .arena-mobile-state>h2::after{flex-basis:24px;width:24px;height:36px}}
@media(max-width:370px){#arena-page .arena-mobile-state>h2{gap:6px}#arena-page .arena-mobile-state>h2::before,#arena-page .arena-mobile-state>h2::after{flex-basis:16px;width:16px;height:26px}}
/* Desktop matchmaking: spacious identities and a separate destination preview. */
@media(min-width:761px){
 #arena-page .arena-mobile-state{max-width:760px;padding:28px 32px;background:radial-gradient(ellipse at 5% 0%,#f0e7ff70,transparent 45%),radial-gradient(ellipse at 100% 100%,#fff0e480,transparent 40%),#fff}
 #arena-page .arena-mobile-state h2{font-size:32px;margin-bottom:6px}
 #arena-page .arena-mobile-state h3{font-size:26px}
 #arena-page .arena-mobile-state>.arena-secondary{color:#fff;text-shadow:0 1px 2px #6b38b8}
 #arena-page .arena-mobile-state .arena-state-subtitle{font-size:15px}
 #arena-page .arena-pair{gap:24px;grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr)}
 #arena-page .arena-pair .arena-player-avatar{width:128px;height:128px;margin:16px}
 #arena-page .arena-pair .arena-player-avatar:after{inset:-18px}
 #arena-page .arena-pair>div{gap:16px;font-size:18px}
 #arena-page .arena-pair-vs{width:64px;height:64px;align-self:start;margin-top:48px}
 #arena-page .arena-pair-dots{align-self:start;margin-top:68px}
 #arena-page .arena-unknown-avatar{width:152px;height:152px;font-size:60px;margin:4px}
 #arena-page .arena-player-rank{font-size:18px;gap:10px}
 #arena-page .arena-player-rank img{width:48px;height:58px}
 #arena-page [data-a="search"]{max-width:760px}
 #arena-page [data-a="search"] .arena-pair{max-width:580px;margin:16px auto}
 #arena-page [data-a="search"] .arena-state-note{width:440px;max-width:100%;margin:20px auto!important;font-size:14px}
 #arena-page [data-a="search"]>.arena-secondary{max-width:320px;margin:0 auto}
 #arena-page [data-a="matched"]{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);column-gap:28px;row-gap:8px;align-items:center}
 #arena-page [data-a="matched"]>h2{grid-column:1 / -1;margin-bottom:18px}
 #arena-page [data-a="matched"] .arena-pair{grid-column:1;grid-row:2 / 5;gap:8px;grid-template-columns:minmax(0,1fr) 44px minmax(0,1fr);margin:0}
 #arena-page [data-a="matched"] .arena-pair .arena-player-avatar{width:110px;height:110px;margin:14px 4px}
 #arena-page [data-a="matched"] .arena-pair .arena-player-avatar:after{inset:-15px}
 #arena-page [data-a="matched"] .arena-pair-vs{width:44px;height:44px;margin-top:48px}
 #arena-page [data-a="matched"] .arena-state-note{grid-column:1;grid-row:5;margin:8px 0 0!important;font-size:14px;background:#fff7ec}
 #arena-page [data-a="matched"] .arena-state-subtitle{grid-column:2;grid-row:2;margin:0!important}
 #arena-page [data-a="matched"] .arena-state-scene{grid-column:2;grid-row:3;height:180px;margin:0;object-position:70% center}
 #arena-page [data-a="matched"]>h3{grid-column:2;grid-row:4}
 #arena-page [data-a="matched"]>.arena-secondary{grid-column:2;grid-row:5;margin:8px 0 0;min-height:48px;font-size:17px}
 #arena-page [data-a="intro-left"]{grid-column:1 / -1;font-size:13px;color:#78658c;margin-top:10px}
 #arena-page [data-a="entering"]{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);column-gap:30px;row-gap:12px;align-items:center}
 #arena-page [data-a="entering"]>h2{grid-column:1 / -1;margin-bottom:14px}
 #arena-page [data-a="entering"] .arena-state-scene{grid-column:1;grid-row:2 / 5;height:270px;margin:0;object-position:70% center}
 #arena-page [data-a="entering"]>h3{grid-column:1;grid-row:5}
 #arena-page [data-a="entering"] .arena-load-steps{grid-column:2;grid-row:2;margin:0 auto;padding:0;font-size:19px}
 #arena-page [data-a="entering"] .arena-load-steps li{min-height:60px;gap:18px}
 #arena-page [data-a="entering"] progress{grid-column:2;grid-row:3}
 #arena-page [data-a="entering"] .arena-state-note{grid-column:2;grid-row:4;margin:0!important;min-height:54px;font-size:14px}

}
/* Restore the wide desktop arena entry while retaining the shared lobby skin. */
@media(min-width:761px){
 #arena-page .arena-entry .arena-go.platform-enter{flex:1 1 0;width:auto;max-width:none;min-width:0}
 #arena-page .arena-entry .claw-system-icon{width:116px;left:50%;transform:translateX(-50%)}
}
/* Approved layout artwork, with the platform's shared full-page heading. */
#arena-page .platform-page-title-art{max-width:none}
#arena-page .platform-page-subtitle{color:var(--p-ink);font-weight:700}
#arena-page .arena-mode{position:relative;isolation:isolate;background:none;border:0;box-shadow:none;border-radius:0;min-width:156px;height:42px;padding:0 12px;gap:6px;justify-content:center;font-size:16px}
#arena-page .arena-mode:before{content:'';position:absolute;z-index:-1;inset:-19px -13px;background:url('/game/platform-art/arena-ui-v1/04-ranked-badge-v6.png') center/100% 100% no-repeat;pointer-events:none}
/* Distance-based SVG dash motion keeps equal speed on long and short edges. */
#arena-page .arena-mode .arena-mode-light{position:absolute;inset:0 1px 2px;width:calc(100% - 2px);height:calc(100% - 2px);overflow:visible;pointer-events:none;filter:drop-shadow(0 0 3px #e4ccff)}
.arena-mode-light rect{width:calc(100% - 2px);height:calc(100% - 2px);fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-dasharray:16 84;animation:arena-mode-border-light 3.2s linear infinite}
@keyframes arena-mode-border-light{from{stroke-dashoffset:0}to{stroke-dashoffset:-100}}
@media(prefers-reduced-motion:reduce){.arena-mode-light rect{animation:none;opacity:.6}}
#arena-page .arena-mode img{width:27px;height:27px}
#arena-page .arena-scene h2{position:relative;width:220px;height:50px;margin:16px 0 32px;padding:0;font-size:0;letter-spacing:0;background:url('/game/platform-art/arena-ui-v1/02-deepsea-title-v6.png') -15.57px -17.23px/248.49px 82.83px no-repeat}
#arena-page .arena-scene h2:after{content:'';position:absolute;left:0;top:56px;width:110px;height:15px;background:url('/game/platform-art/arena-ui-v1/03-rainbow-wave-v6.png') -38.75px -24.38px/187.5px 62.5px no-repeat}
#arena-page .arena-scene-copy{padding:20px}
#arena-page .arena-scene:after{background:linear-gradient(90deg,#edf7fff0 0%,#eff7ff90 30%,#eaf5ff00 55%)}
@media(max-width:760px){
 #arena-page .arena-mode{position:absolute;left:10px;top:10px;min-width:144px;height:38px;font-size:14px}
 #arena-page .arena-scene-copy{padding:0}
 #arena-page .arena-scene h2{margin:6px auto 18px;width:156px;height:35px;background-position:-11px -12.22px;background-size:176.2px 58.73px}
 #arena-page .arena-scene h2:after{top:36px;left:39px;transform:scale(.7);transform-origin:top left}
}
/* Preserve entry geometry through pending/queued/idle transitions. */
#arena-page .arena-entry-slot{position:relative;flex:none;min-width:0}
#arena-page.is-queued .arena-entry-slot>.arena-entry{display:flex;visibility:hidden;pointer-events:none}
#arena-page .arena-entry-slot>.arena-queue{position:absolute;inset:0;min-height:0;overflow:auto;margin:0}

/* Reference rank heading: gold crown between lavender line-and-dot ornaments. */
#arena-page .arena-rank h2{width:100%;justify-content:center;gap:8px;white-space:nowrap}
#arena-page .arena-rank h2 img{width:32px;height:32px;object-fit:contain;flex:none;transform:rotate(-8deg);margin-right:-4px}
#arena-page .arena-rank h2::before,#arena-page .arena-rank h2::after{content:"";height:8px;flex:1;max-width:54px;min-width:12px;background:radial-gradient(circle at calc(100% - 4px) 50%,#b77bff 0 3px,transparent 3.5px),linear-gradient(90deg,#e5c6ff,#bd8aff) left center/calc(100% - 12px) 1px no-repeat}
#arena-page .arena-rank h2::after{transform:scaleX(-1)}
@media(max-width:760px){#arena-page .arena-rank h2{gap:5px}#arena-page .arena-rank h2 img{width:24px;height:24px}#arena-page .arena-rank h2::before,#arena-page .arena-rank h2::after{min-width:8px;max-width:26px}}

/* Independent underwater podium, shared by all six rank claw images. */
#arena-page .arena-rank{background-image:none}
#arena-page .arena-rank-display{position:relative;isolation:isolate;width:calc(100% + 24px);max-width:280px;height:240px;flex:none;margin:0 -12px;background:url('/game/platform-art/arena-ui-v1/32-rank-stage-v1.png') center bottom/100% 100% no-repeat}
#arena-page .arena-rank-display .arena-rank-art{position:absolute;z-index:1;width:78%!important;height:82%;object-fit:contain;left:11%;top:0;margin:0;filter:drop-shadow(0 8px 8px #9c8ab42b)}
@media(max-width:760px){#arena-page .arena-rank-display{grid-column:1;grid-row:1 / 3;width:calc(100% + 12px);max-width:none;height:162px;margin:0 -6px}#arena-page .arena-rank-display .arena-rank-art{width:86%!important;left:7%;height:82%;grid-column:auto;grid-row:auto}}

/* Pink tint for the arena entry face; retain shared button geometry and states. */
#arena-page .arena-entry .arena-go.platform-enter{border:1px solid #ff6096;background:linear-gradient(#ff77a5 0%,#ff4288 70%,#ff4d90);color:#fff}
#arena-page .arena-entry .arena-go.platform-enter :is(.claw-system-skin,.claw-system-icon){display:none}
#arena-page .arena-entry .arena-go.platform-enter .claw-system-face{gap:6px}
#arena-page .arena-entry .arena-go.platform-enter .claw-system-face-text{margin-right:0}
#arena-page .arena-entry .arena-go.platform-enter .claw-system-face:after{content:'';width:7px;height:7px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}

/* Patterned step badges: text stays separate from the reusable blank artwork. */
#arena-page .arena-how li::before{width:36px;height:36px;background:transparent url('/game/platform-art/arena-ui-v1/35-step-badge-v1.png') center/contain no-repeat;border-radius:0;color:#fff;font-size:20px;line-height:1;text-shadow:0 1px 2px #8054c978}

/* User-requested real bold title with a white outer glow. */
#arena-page#arena-page .arena-scene h2{background:none;width:220px;height:50px;font-family:ClawSystemLocal,system-ui,sans-serif!important;font-size:42px;line-height:50px;font-weight:400!important;font-synthesis:none!important;letter-spacing:1px;white-space:nowrap;color:#080953;text-shadow:0 0 2px #fff,0 0 5px #fff,0 0 10px #fff,0 0 16px #ffffffd9}
@media(max-width:760px){#arena-page#arena-page .arena-scene h2{width:156px;height:35px;font-size:30px;line-height:35px;letter-spacing:1px}}

/* White outer glow for the three-line scene description. */
#arena-page .arena-scene-copy>p{text-shadow:0 0 2px #fff,0 0 4px #fff,0 0 8px #fff,0 0 12px #ffffffd9}

/* Balanced desktop action and fee columns. */
@media(min-width:761px){
 #arena-page .arena-entry{gap:24px}
 #arena-page .arena-entry .arena-fee{flex:0 0 auto;box-sizing:border-box;margin-left:0;padding-left:24px}
}

/* Direction chevrons between the three desktop steps. */
@media(min-width:761px){
 #arena-page .arena-how li{position:relative}
 #arena-page .arena-how li:not(:last-child)::after{content:'';position:absolute;right:-11px;top:50%;width:8px;height:8px;border-top:2px solid #b29bd8;border-right:2px solid #b29bd8;transform:translateY(-50%) rotate(45deg);pointer-events:none}
}
/* Rank help reuses the profile question icon and tooltip surface. */
#arena-page .arena-tier-heading{display:flex;align-items:center;justify-content:center;gap:8px;position:relative;z-index:3}
#arena-page .arena-rank-help .profile-name-tooltip{left:auto;right:-16px;width:252px;box-sizing:border-box;max-width:calc(100vw - 32px)}
#arena-page .arena-rank-help .profile-name-tooltip:before{left:auto;right:23px}
#arena-page .arena-rank-help .arena-tier-list{gap:10px;font-size:12px}
#arena-page .arena-rank-help .arena-tier-list img{width:54px;height:58px}
#arena-page .arena-rank-help .arena-tier-list span{display:block;white-space:normal;font-size:11px;line-height:1.5}
.platform-message-dialog:has(.arena-history){width:min(700px,calc(100vw - 24px))}
.arena-history{color:#15115b;text-align:left;min-width:0}
.arena-history-list{display:grid;gap:12px}
.arena-history-match{border:1px solid #e8def5;border-radius:16px;background:#fff;padding:14px}
.arena-history-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;overflow-wrap:anywhere}
.arena-history-heading strong{color:#8050c2;flex-shrink:0;font-size:20px}
.arena-history-id{font-size:11px;overflow-wrap:anywhere;color:#79718f;margin:6px 0}
.arena-history-time{font-size:12px;color:#79718f;margin:3px 0;line-height:1.6}
.arena-history-scores{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0}
.arena-history-scores>div{display:flex;align-items:center;gap:8px;background:#f6f2ff;border-radius:12px;padding:8px;min-width:0;font-size:13px}
.arena-history-scores strong{margin-left:auto;font-size:24px}
.arena-history-targets{display:flex;gap:3px;font-size:11px}
.arena-history-targets img{width:36px;height:40px;object-fit:contain}
.arena-history-rating{margin:0;color:#7052a2;font-size:14px}
.arena-history-status{text-align:center;padding:24px 8px}
@media(max-width:460px){.arena-history-match{padding:10px}.arena-history-scores{gap:6px}.arena-history-scores>div{flex-wrap:wrap;gap:4px}.arena-history-targets img{width:26px;height:30px}.arena-history-heading{font-size:13px}.arena-history-time{font-size:11px}}
@media(min-width:761px){#arena-page .arena-rank-help .profile-name-tooltip{left:-170px;right:auto}#arena-page .arena-rank-help .profile-name-tooltip:before{left:177px;right:auto}}
.arena-history-list{max-height:52dvh;overflow-y:auto;padding-right:4px;overscroll-behavior:contain}
.platform-message-dialog .arena-history-id{font-size:11px;margin:6px 0}
.platform-message-dialog .arena-history-time{font-size:12px;margin:3px 0}
.platform-message-dialog .arena-history-rating{font-size:14px}

/* Optical alignment with the rank name glyphs. */
#arena-page .arena-rank-help .profile-name-help-button{transform:translateY(2px)}

/* Center the desktop rank tooltip within its white card. */
@media(min-width:761px){
 #arena-page .arena-rank-help{position:static}
 #arena-page .arena-rank-help .profile-name-tooltip{left:0;right:0;width:100%;max-width:none;top:calc(100% + 8px)}
 #arena-page .arena-rank-help .profile-name-tooltip:before{left:calc(50% + 36px);right:auto}
}
/* Center each arrow in the space between the actual step groups. */
@media(min-width:761px){
 #arena-page .arena-how ol{grid-template-columns:minmax(0,max-content) minmax(28px,1fr) minmax(0,max-content) minmax(28px,1fr) minmax(0,max-content);gap:0;align-items:center}
 #arena-page .arena-how li{grid-row:1;min-width:0}
 #arena-page .arena-how li:nth-child(1){grid-column:1}
 #arena-page .arena-how li:nth-child(2){grid-column:3}
 #arena-page .arena-how li:nth-child(3){grid-column:5}
 #arena-page .arena-how li:not(:last-child)::after{content:none}
 #arena-page .arena-how ol::before,#arena-page .arena-how ol::after{content:'';grid-row:1;justify-self:center;width:8px;height:8px;border-top:2px solid #b29bd8;border-right:2px solid #b29bd8;transform:rotate(45deg);pointer-events:none}
 #arena-page .arena-how ol::before{grid-column:2}
 #arena-page .arena-how ol::after{grid-column:4}
}
/* Keep the mobile rank details on a single centered column. */
@media(max-width:760px){
 #arena-page .arena-rank-copy{display:flex;flex-direction:column;gap:8px;align-items:stretch;text-align:center}
 #arena-page .arena-rank h3{margin:0;font-size:25px}
 #arena-page .arena-stars{justify-content:center;gap:3px;flex-wrap:nowrap}
 #arena-page .arena-record{margin:0;padding:4px 0;gap:6px}
 #arena-page .arena-record>span{justify-content:center;gap:4px;white-space:nowrap}
 #arena-page .arena-rank .arena-link{align-self:center;padding:3px 0;min-height:32px}
}
/* Cancel matchmaking shares the entry button treatment in purple. */
#arena-page button:is([data-a="search-leave"],[data-a="start-selection"]),#arena-page button[data-a="leave"]{border:1px solid #a06ae7;border-radius:12px;background:linear-gradient(#ba91f1 0%,#9554df 70%,#a065e5);box-shadow:inset 0 1px #ffffffbb,0 3px 0 #77718b22;color:#fff;height:47px;min-height:47px;padding:0 20px;font-size:17px;line-height:1.2;letter-spacing:0;text-shadow:none;transition:filter .15s,transform .15s}
#arena-page button:is([data-a="search-leave"],[data-a="start-selection"]):hover:not(:disabled),#arena-page button[data-a="leave"]:hover:not(:disabled){filter:brightness(1.04)}
#arena-page button:is([data-a="search-leave"],[data-a="start-selection"]):active:not(:disabled),#arena-page button[data-a="leave"]:active:not(:disabled){transform:translateY(1px)}
#arena-page button:is([data-a="search-leave"],[data-a="start-selection"]):disabled,#arena-page button[data-a="leave"]:disabled{cursor:not-allowed;filter:grayscale(1);opacity:.6}
@media(max-width:760px){#arena-page button:is([data-a="search-leave"],[data-a="start-selection"]){height:52px;min-height:52px;font-size:15px}}

/* Image-backed unknown opponent, shared by desktop and mobile. */
#arena-page .arena-unknown-avatar{border:0;background:none;border-radius:0}
#arena-page .arena-unknown-avatar>img{display:block;width:100%;height:100%;object-fit:contain}

/* Sequential matchmaking pulse; transforms never change layout dimensions. */
#arena-page .arena-pair-dots{display:inline-flex;align-items:center;justify-content:space-between;gap:10px;min-height:36px;letter-spacing:0}
#arena-page .arena-pair-dots>i{display:block;flex:none;width:5px;height:5px;border-radius:50%;background:#cbb4f5;animation:arena-dot-pulse 1.8s ease-in-out infinite}
#arena-page .arena-pair-dots>i:nth-child(2){animation-delay:.3s}
#arena-page .arena-pair-dots>i:nth-child(3){animation-delay:.6s}
@keyframes arena-dot-pulse{0%,50%,100%{transform:scale(1);background:#cbb4f5}25%{transform:scale(1.8);background:#8050d8}}
@media(prefers-reduced-motion:reduce){#arena-page .arena-pair-dots>i{animation:none}}

/* Stable tip slot while random copy rotates during matchmaking. */
#arena-page [data-a="search"] .arena-state-note{height:56px;min-height:56px}
#arena-page [data-a="search"] .arena-state-note>img{flex:none}
#arena-page [data-a="search-tip"]{min-width:0;line-height:16px}

/* Keep opponent nicknames inside their match introduction column. */
#arena-page [data-a="matched-them"]>p{max-width:100%;overflow-wrap:anywhere;line-height:1.4}

/* Entering: image-backed progress and a wave-cut scene with a larger DOM title. */
#arena-page [data-a="entering"]{background:#fff}
#arena-page .arena-entering-scene{margin:0;min-width:0}
#arena-page .arena-entering-picture{position:relative;overflow:hidden;border-radius:18px}
#arena-page .arena-entering-picture:after{content:'';position:absolute;bottom:-1px;left:0;width:100%;height:30px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 40' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 16 Q50 40 100 20 T200 20 T300 20 T400 16 V40 H0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
#arena-page [data-a="entering"] .arena-state-scene{margin:0;height:260px}
#arena-page [data-a="entering"] [data-a="entering-name"]{font-size:32px;line-height:1.25;margin:-2px 0 8px;font-weight:700;text-shadow:0 0 5px #fff;position:relative}
#arena-page .arena-load-steps li:before{display:none;content:none}
#arena-page .arena-load-icon{display:block;width:32px;height:32px;object-fit:contain;flex:none;z-index:1}
#arena-page .arena-load-steps li+li:after{left:15px}
#arena-page .arena-load-steps .is-active{color:#7950cb}
#arena-page .arena-load-steps .is-active .arena-load-icon{animation:arena-load-glow 2s ease-in-out infinite}
#arena-page .arena-load-status{color:#817599;font-size:12px;line-height:1.5;margin:8px 0 0;min-height:18px}
#arena-page .arena-loading-tip{height:64px;min-height:64px;margin:12px 0 0!important}
#arena-page .arena-loading-tip img{width:42px;height:42px;object-fit:contain;flex:none}
#arena-page [data-a="load-tip"]{min-width:0;line-height:1.5}
@keyframes arena-load-glow{0%,100%{filter:brightness(1) saturate(.95);transform:scale(1)}50%{filter:brightness(1.16) saturate(1.25);transform:scale(1.06)}}
@media(min-width:761px){
 #arena-page .arena-entering-scene{grid-column:1;grid-row:2 / 6}
 #arena-page [data-a="entering"] .arena-state-scene{height:290px}
 #arena-page [data-a="entering"] [data-a="entering-name"]{font-size:36px}
 #arena-page [data-a="entering"] .arena-load-status{grid-column:2;grid-row:4;margin:0}
 #arena-page [data-a="entering"] .arena-loading-tip{grid-column:2;grid-row:5;margin:0!important;font-size:13px}
}
@media(max-width:350px){#arena-page [data-a="entering"]>h2{font-size:24px}#arena-page [data-a="entering"] .arena-state-scene{height:220px}#arena-page [data-a="entering"] [data-a="entering-name"]{font-size:30px}}
@media(prefers-reduced-motion:reduce){#arena-page .arena-load-steps .is-active .arena-load-icon{animation:none}}

/* Approved history proposal: result / rank settlement / match metadata. */
.platform-message-dialog:has(.arena-history){width:min(900px,calc(100vw - 24px));position:fixed}
.platform-message-dialog:has(.arena-history) .platform-message-content{padding:24px 24px 0}
.platform-message-dialog:has(.arena-history) #platform-message-description{color:#91a5b4;margin:6px 0 14px}
.arena-history-list{gap:16px;max-height:62dvh;padding-right:8px;scrollbar-gutter:stable}
.arena-history-match{padding:16px;border:1px solid #d9caff;border-radius:18px;background:linear-gradient(125deg,#fff,#fdfbff)}
.arena-history-match[data-result="win"]{border-color:#f6d692;background:linear-gradient(125deg,#fff,#fffdf7)}
.arena-history-heading{font-size:16px;margin-bottom:12px;gap:12px}
.arena-history-heading>span{text-align:right;min-width:0}
.arena-history-heading .arena-history-outcome{font-size:22px;line-height:1.25;color:#261066;background:linear-gradient(#e8ddff,#ddd0ff);border-radius:24px;padding:5px 24px}
[data-result="win"] .arena-history-outcome{color:#80500b;background:linear-gradient(#ffe8a4,#ffdc78)}
.arena-history-scores{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:12px;margin:0 0 8px;padding:12px 16px;border-radius:18px;background:linear-gradient(110deg,#f7f3ff,#fbf8ff)}
[data-result="win"] .arena-history-scores{background:linear-gradient(110deg,#fff8e9,#fffaf1)}
.arena-history-scores>.arena-history-side{padding:0;background:none;font-size:16px;gap:12px;min-width:0;justify-content:center;flex-wrap:nowrap}
.arena-history-targets{min-width:0;gap:6px;align-items:center;justify-content:center}
.arena-history-targets img{width:56px;height:64px;object-fit:contain}
.arena-history-scores>.arena-history-score{display:flex;gap:12px;padding:0;background:none;font-size:40px;line-height:1;white-space:nowrap}
.arena-history-score span{color:#91a1bc}
.arena-history-scores .arena-history-score strong{font-size:52px;margin:0;color:#0c0755;line-height:1.1}
.arena-history-match[data-result="win"] .arena-history-score strong:first-child,
.arena-history-match[data-result="loss"] .arena-history-score strong:last-child{color:#ff3981}
.platform-message-dialog .arena-history-rating{display:flex;align-items:center;justify-content:space-between;gap:12px;background:linear-gradient(110deg,#f3edff,#f5efff);padding:5px 12px;border-radius:16px;margin:0;font-size:17px;color:#10095d}
[data-result="win"] .arena-history-rating{background:linear-gradient(110deg,#fff3d7,#fff7e7)}
.arena-history-rank-name{display:flex;align-items:center;gap:12px;min-width:0}
.arena-history-rank-name img{width:36px;height:44px;object-fit:contain;flex:none}
.arena-history-delta{white-space:nowrap;border-radius:24px;background:#e5d8ff;color:#49308d;padding:6px 18px}
.arena-history-delta.is-gain{background:#ffd5e5;color:#ff357b}
.arena-history-meta{border-top:1px solid #eae1f7;margin-top:12px;padding-top:10px;display:grid;grid-template-columns:1fr 1fr;gap:8px 16px;font-size:14px;color:#514773}
.arena-history-detail{display:grid;grid-template-columns:20px 34px 1fr;gap:8px;align-items:center;min-width:0;line-height:1.5}
.arena-history-detail:nth-child(3){grid-column:1 / -1}
.arena-history-icon{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}
.platform-message-dialog .arena-history-id{grid-column:1 / -1;display:grid;grid-template-columns:20px 64px minmax(0,max-content) 32px;align-items:center;gap:8px;margin:0;font-size:13px;color:#514773;line-height:1.5}
.arena-history-id-value{overflow-wrap:anywhere;user-select:all}
.arena-history-copy{display:grid;place-items:center;width:32px;height:32px;padding:4px;border:0;background:transparent;color:#51439a;border-radius:6px;cursor:pointer}
.arena-history-copy:hover{background:#eee7ff}
.arena-history-copy-status{grid-column:3 / -1;font-size:11px;min-height:0}
.arena-history-copy-status:empty{display:none}
@media(max-width:760px){
 .platform-message-dialog:has(.arena-history) .platform-message-content{padding:20px 14px 0}
 .arena-history-list{max-height:62dvh;padding-right:4px;gap:14px}
 .arena-history-match{padding:12px}
 .arena-history-heading{font-size:13px;gap:8px}
 .arena-history-heading .arena-history-outcome{font-size:20px;padding:5px 18px}
 .arena-history-scores{gap:6px;padding:12px 6px}
 .arena-history-scores>.arena-history-side{flex-direction:column;gap:8px;font-size:14px}
 .arena-history-targets{gap:2px}
 .arena-history-targets img{width:36px;height:46px}
 .arena-history-scores>.arena-history-score{gap:6px}
 .arena-history-scores .arena-history-score strong{font-size:36px}
 .platform-message-dialog .arena-history-rating{font-size:15px;padding:5px 8px;gap:6px}
 .arena-history-rank-name{gap:8px}.arena-history-delta{padding:5px 12px}
 .arena-history-meta{grid-template-columns:1fr;gap:0;font-size:13px}
 .arena-history-detail{padding:9px 0;border-bottom:1px solid #eee6f8}
 .platform-message-dialog .arena-history-id{grid-template-columns:20px minmax(0,1fr) 30px;padding-top:9px;gap:4px 8px;font-size:12px}
 .arena-history-id-label{grid-column:2}.arena-history-id-value{grid-column:2;grid-row:2}.arena-history-copy{grid-column:3;grid-row:1 / 3}
 .arena-history-copy-status{grid-column:2 / -1}
}
@media(max-width:360px){.arena-history-targets img{width:28px;height:38px}.arena-history-scores .arena-history-score strong{font-size:30px}.arena-history-rank-name img{width:28px}.arena-history-rank-name{gap:4px}.platform-message-dialog .arena-history-rating{font-size:13px}.arena-history-heading{font-size:12px}}

/* Approved selection proposal: compact identity, timed ring and large target cards. */
#arena-page .arena-selection{max-width:960px;margin:0 auto;padding:28px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);column-gap:28px;row-gap:18px;background:#fff}
#arena-page .arena-selection-summary{grid-column:1;grid-row:1;min-width:0}
#arena-page .arena-match-heading h2{font-size:32px;line-height:1.3;margin:0 0 10px}
#arena-page .arena-match-heading p{font-size:16px;color:#796b9d;margin:0 0 22px}
.arena-selection-identity{display:flex;align-items:center;gap:16px;padding-bottom:18px;border-bottom:1px solid #e6dcf6}
.arena-selection-opponent{display:flex;align-items:center;gap:14px;flex:1;min-width:0;padding:14px;background:linear-gradient(120deg,#f4efff,#faf6ff);border-radius:22px;text-align:left}
.arena-selection-opponent>span:last-child{min-width:0;display:grid;gap:5px}
.arena-selection-opponent small{font-size:14px;color:#9072bc}
.arena-selection-opponent strong{font-size:17px;overflow-wrap:anywhere;font-weight:400}
#arena-page .arena-selection-opponent .arena-player-avatar{width:52px;height:52px;margin:4px;flex:none}
#arena-page .arena-selection-opponent .arena-player-avatar:after{inset:-8px}
#arena-page .arena-countdown{position:relative;display:grid;place-items:center;width:88px;height:88px;flex:none;padding:0;background:none;color:#10095d;border-radius:0;font-size:inherit}
.arena-countdown svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);fill:none;stroke-width:12}
.arena-countdown-track{stroke:#ede4ff}
.arena-countdown-ring{stroke:#a777f4;stroke-dasharray:100;stroke-dashoffset:0;stroke-linecap:round;transition:stroke-dashoffset .1s linear,stroke .3s}
.arena-countdown.is-urgent .arena-countdown-ring{stroke:#f76ba4}
.arena-countdown>span{display:grid;place-items:center;gap:0;position:relative}
.arena-countdown strong{font-size:30px;line-height:1.1;font-weight:400}.arena-countdown small{font-size:13px;line-height:1.2}
#arena-page .arena-select-line{display:flex;align-items:center;justify-content:center;gap:12px;margin:18px 0 14px}
#arena-page .arena-select-line h3{font-size:20px;margin:0}
#arena-page [data-a="pick-count"]{border-radius:20px;background:#ffe9f3;color:#ef4b93;padding:3px 14px;font-size:20px}
#arena-page .arena-picks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0}
#arena-page .arena-picks button{position:relative;display:grid;place-items:center;width:100%;height:auto;aspect-ratio:1.2;min-width:0;border:1.5px dashed #cfb5ff;border-radius:20px;padding:16px;background:linear-gradient(145deg,#fcfaff,#f3edff);color:#b49bdd}
#arena-page .arena-picks button.is-picked{border-style:solid;border-color:#ad7cff}
#arena-page .arena-picks button>img{width:100%;height:100%;max-height:130px;object-fit:contain}
.arena-pick-number{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);font-size:18px}
.is-picked .arena-pick-number{left:8px;bottom:8px;transform:none;display:grid;place-items:center;background:linear-gradient(#bf96fa,#9755ed);color:white;border:1px solid white;border-radius:50%;width:24px;height:24px;font-size:16px}
.arena-pick-plus{position:relative;width:30px;height:30px;align-self:center;margin-bottom:18px}
.arena-pick-plus:before,.arena-pick-plus:after{content:'';position:absolute;left:0;top:13px;width:30px;height:5px;background:#c6acf0;border-radius:4px}.arena-pick-plus:after{transform:rotate(90deg)}
.arena-pick-remove{position:absolute;right:8px;top:8px;width:24px;height:24px;border-radius:50%;background:#8e80af}
.arena-pick-remove:before,.arena-pick-remove:after{content:'';position:absolute;left:6px;top:11px;width:12px;height:2px;background:white;border-radius:2px;transform:rotate(45deg)}.arena-pick-remove:after{transform:rotate(-45deg)}
.arena-selection-pool{grid-column:2;grid-row:1 / 3;border-left:1px solid #ece4f8;padding-left:28px;min-width:0;align-content:start}
#arena-page .arena-selection-pool h3{font-size:24px;line-height:1.3;margin:0 0 6px}.arena-selection-pool>p{font-size:13px;color:#9184a8;margin:0 0 20px}
#arena-page .arena-selection .arena-pool{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0}
#arena-page .arena-pool button{position:relative;aspect-ratio:1;width:100%;height:auto;min-width:0;padding:6px;border:1px solid #e1d3f6;border-radius:16px;background:linear-gradient(#fff,#f8f4fc);opacity:1}
#arena-page .arena-pool button.is-picked{border-color:#ae7bff;background:linear-gradient(#f9f4ff,#eee3ff)}
#arena-page .arena-pool button img{display:block;width:100%;height:100%;object-fit:contain}
.arena-pool-count{position:absolute;left:4px;bottom:4px;width:21px;height:21px;display:grid;place-items:center;border-radius:50%;background:#aa70f5;border:1px solid white;color:white;font-size:14px}
.arena-selection-actions{grid-column:1;grid-row:2;border-top:1px dashed #e4d8f4;padding-top:16px;min-width:0}
#arena-page .arena-selection-actions .arena-go{width:100%;height:52px;min-height:52px;border:1px solid #ff7cab;border-radius:14px;background:linear-gradient(#ff79ad,#ff398b);box-shadow:inset 0 1px #ffffffbb,0 3px #eadff0;color:white;font-size:20px;padding:0 10px}
#arena-page .arena-selection-actions .arena-go:disabled{background:linear-gradient(#fbcfe1,#eea2c2);border-color:#f3bcd3;filter:none;opacity:1;cursor:not-allowed}
#arena-page .arena-selection-actions .arena-help{font-size:12px;color:#a095b1;margin:10px 0 0}
#arena-page [data-a="select-status"]{font-size:13px;color:#8969b1;margin:8px 0 0;min-height:0}
#arena-page [data-a="select-status"]:empty{display:none}
@media(max-width:760px){
 #arena-page:has([data-a="select"]:not([hidden]))>header[data-page-heading]{display:none!important}
 #arena-page .arena-selection{display:flex;flex-direction:column;padding:20px 14px;gap:16px;max-width:480px}
 #arena-page .arena-match-heading h2{font-size:27px;margin-bottom:8px}
 #arena-page .arena-match-heading p{font-size:14px;margin-bottom:16px}
 .arena-selection-identity{gap:12px;padding-bottom:14px}
 .arena-selection-opponent{padding:12px;gap:12px}.arena-selection-opponent strong{font-size:16px}
 #arena-page .arena-countdown{width:80px;height:80px}
 #arena-page .arena-select-line{margin:14px 0 12px}
 #arena-page .arena-picks{gap:14px}
 #arena-page .arena-picks button{aspect-ratio:1.3;max-height:135px;padding:12px}
 #arena-page .arena-picks button>img{max-height:100px}
 .arena-selection-pool{border:0;padding:0}
 #arena-page .arena-selection-pool h3{font-size:21px}.arena-selection-pool>p{margin:0 0 12px}
 #arena-page .arena-selection .arena-pool{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
 #arena-page .arena-pool button{padding:4px;border-radius:13px}
 .arena-selection-actions{border:0;padding:0}
 #arena-page .arena-selection-actions .arena-go{font-size:18px;height:48px;min-height:48px}
}
@media(max-width:350px){#arena-page .arena-match-heading h2{font-size:23px}.arena-selection-opponent{padding:10px 7px;gap:7px}#arena-page .arena-selection-opponent .arena-player-avatar{width:40px;height:40px}#arena-page .arena-countdown{width:66px;height:66px}.arena-countdown strong{font-size:26px}.arena-selection-opponent strong{font-size:13px}}
@media(prefers-reduced-motion:reduce){.arena-countdown-ring{transition:none}}

/* The wave owns the lower edge; rounded lower corners leave blue slivers beside it. */
#arena-page .arena-scene{border-bottom-left-radius:0;border-bottom-right-radius:0}
#arena-page .arena-scene-image{border-bottom-left-radius:0;border-bottom-right-radius:0}
/* Lobby scene: reuse the entering scene wave without changing layout. */
#arena-page .arena-scene:before{content:'';pointer-events:none;z-index:1;position:absolute;bottom:-1px;left:0;width:100%;height:30px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 40' preserveAspectRatio='none'%3E%3Cpath fill='white' d='M0 16 Q50 40 100 20 T200 20 T300 20 T400 16 V40 H0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat}
@media(max-width:760px){#arena-page .arena-scene:before{top:201px;bottom:auto}}

.arena-history-heading>.arena-history-opponent{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0}
.arena-history-opponent>span:last-child{min-width:0;overflow-wrap:anywhere}
.arena-history-opponent .arena-history-avatar{position:relative;display:block;width:32px;height:32px;flex:0 0 32px;border-radius:50%;overflow:hidden}
.arena-history-avatar img{display:block;width:100%;height:100%;object-fit:contain}

.arena-history-icon.arena-history-candy-icon{width:24px;height:24px;object-fit:contain}
.arena-history-detail{grid-template-columns:24px 34px minmax(0,1fr)}
.platform-message-dialog .arena-history-id{grid-template-columns:24px 64px minmax(0,max-content) 32px}
@media(max-width:760px){.platform-message-dialog .arena-history-id{grid-template-columns:24px minmax(0,1fr) 30px}}

/* History summaries fetch their details only when opened. */
.arena-history-toggle{display:block;position:relative;width:100%;padding:0 22px 0 0;border:0;background:none;color:inherit;font:inherit;text-align:inherit;cursor:pointer;border-radius:16px}
.arena-history-toggle:focus-visible{outline:2px solid #a378ef;outline-offset:4px}
.arena-history-toggle .arena-history-scores{margin:0}
.arena-history-chevron{position:absolute;right:3px;top:calc(50% - 4px);width:8px;height:8px;border-right:2px solid #b293df;border-bottom:2px solid #b293df;transform:rotate(45deg);transition:transform .3s ease}
.is-expanded>.arena-history-toggle .arena-history-chevron{transform:rotate(225deg)}
@media(max-width:760px){.arena-history-toggle{padding-right:0}.arena-history-toggle .arena-history-chevron{display:none}}
.arena-history-expand{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .32s ease,opacity .25s ease}
.is-expanded>.arena-history-expand{grid-template-rows:1fr;opacity:1}
.arena-history-expand-inner{min-height:0;overflow:hidden}
.arena-history-detail-content{padding-top:16px;animation:arena-history-detail-in .28s ease}
.arena-history-retry{margin:0 0 14px;padding:8px 16px;border:1px solid #c9b0ef;border-radius:10px;background:#f3edff;color:#6941ac;font:inherit;cursor:pointer}
@keyframes arena-history-detail-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.arena-history-expand,.arena-history-chevron{transition:none}.arena-history-detail-content{animation:none}}

/* Local-only, manually stepped presentation review. */
#arena-page.is-manual-preview> :not(header):not(.arena-manual-preview){display:none!important}
#arena-page .arena-preview-launch{display:block;margin:18px auto 0;padding:8px 20px;border:1px dashed #ba91e9;border-radius:20px;background:#f5efff;color:#7756a6}
#arena-page .arena-preview-toolbar{border:1px solid #d9c4f4;border-radius:16px;padding:12px;margin:0 auto 16px;max-width:760px;background:#fcfaff;text-align:center}
.arena-preview-toolbar small{display:block;color:#91839f;margin:4px 0 10px}
.arena-preview-tabs,.arena-preview-nav,.arena-preview-load{display:flex;justify-content:center;flex-wrap:wrap;gap:8px}
#arena-page .arena-preview-toolbar button,#arena-page .arena-preview-load button{border:1px solid #dbc7f3;border-radius:12px;padding:6px 12px;background:white;color:#72509c}
#arena-page .arena-preview-toolbar button[aria-pressed=true],#arena-page .arena-preview-load button[aria-pressed=true]{background:#9865df;color:white;border-color:#9865df}
.arena-preview-nav{margin-top:10px}.arena-preview-load{margin-top:16px}
#arena-page .arena-preview-tabs,#arena-page .arena-preview-load{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
#arena-page .arena-preview-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
#arena-page .arena-preview-load{grid-column:1 / -1}
#arena-page .arena-preview-toolbar button,#arena-page .arena-preview-load button{min-width:0;width:100%;font-size:14px}
#arena-page .arena-preview-queue{display:flex!important;position:absolute;inset:0;z-index:2}
#arena-page .arena-preview-screen.arena-mobile-state{margin-top:0}
@media(max-width:760px){#arena-page .arena-preview-toolbar{padding:10px}.arena-preview-tabs{display:grid;grid-template-columns:1fr 1fr}#arena-page .arena-preview-toolbar button{font-size:13px;padding:7px}.arena-preview-toolbar small{font-size:11px}#arena-page .arena-preview-queue{position:static}}
@media(max-width:760px){#arena-page .arena-preview-tabs,#arena-page .arena-preview-load{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Help belongs to the artwork; the rank name remains centered independently. */
#arena-page .arena-rank-display{z-index:4}
#arena-page .arena-rank-display .arena-rank-help{position:static}
#arena-page .arena-rank-display .profile-name-help-button{position:absolute;right:32px;top:8px;z-index:5;transform:none}
#arena-page .arena-rank-display .profile-name-tooltip{left:14px;right:14px;top:42px;width:auto;max-width:none;z-index:6}
#arena-page .arena-rank-display .profile-name-tooltip:before{left:auto;right:25px}
@media(max-width:760px){
 #arena-page .arena-rank-display .profile-name-help-button{right:12px;top:0}
 #arena-page .arena-rank-display .profile-name-tooltip{left:0;right:auto;top:32px;width:min(300px,calc(100vw - 56px))}
 #arena-page .arena-rank-display .profile-name-tooltip:before{display:none}
}

/* Settlement is a platform surface after leaveRoom(), never an in-game HUD. */
#arena-page .arena-result{padding:0;max-width:820px;margin:0 auto;overflow:hidden;border:1px solid #e7ddf9;border-radius:24px;background:#fffdfc;box-shadow:0 12px 38px #7e68991a}
#arena-page .arena-settlement-header{justify-content:center;min-height:66px;padding:12px 22px;margin:0;border-radius:0;border-bottom:1px solid #e2d6fa}
#arena-page .arena-settlement-header h2{font-size:28px;color:#100c55;margin:0}
.arena-settlement-body{position:relative;isolation:isolate;padding:20px 42px 26px;background:linear-gradient(#ffffffce,#fffffff2 76%),url('/game/platform-art/arena-ui-v1/01-hero-v6.png') center top/cover no-repeat}
.arena-settlement-body:after{content:'';position:absolute;bottom:0;left:0;right:0;height:15px;background:linear-gradient(90deg,#ccefff70,#cbb9ff50,#d2f9ff90);border-radius:60% 45% 0 0;z-index:-1}
.arena-settlement-hero{text-align:center;min-height:110px}
.arena-settlement-hero>img{width:42px;height:32px;object-fit:contain;margin:0 auto;display:block}
#arena-page .arena-result .arena-settlement-title{font-size:52px;line-height:1.2;font-weight:400;color:#ff3885;margin:0;text-shadow:0 2px #fff,0 4px 10px #ff88b549;letter-spacing:4px}
#arena-page#arena-page .arena-result[data-outcome="win"] .arena-settlement-title{font-weight:700!important;font-synthesis:weight!important;letter-spacing:0;text-align:center}
#arena-page [data-outcome="loss"] .arena-settlement-title{color:#8d62d9}
#arena-page [data-outcome="draw"] .arena-settlement-title,#arena-page [data-outcome="void"] .arena-settlement-title{color:#7764ad}
.arena-settlement-theme{font-size:22px;margin:6px 0 0;color:#100d55}
.arena-settlement-versus{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:16px;align-items:center;margin:12px 0 20px}
.arena-settlement-player{display:flex;flex-direction:column;align-items:center;min-width:0;gap:4px}
#arena-page .arena-settlement-player .arena-player-avatar{width:112px;height:112px;margin:16px 12px}
#arena-page .arena-settlement-player .arena-player-avatar:after{inset:-16px}
.arena-settlement-nickname{font-size:18px;font-weight:400;max-width:100%;overflow-wrap:anywhere;background:#ffffffc9;border:1px solid #e2d4ff;border-radius:14px;padding:4px 15px;line-height:1.35}
.arena-settlement-player>small{font-size:12px;color:#716395}
.arena-settlement-score{display:flex;align-items:center;justify-content:center;gap:12px;color:#160c63;font-size:70px;line-height:1}
.arena-settlement-score strong{font-weight:400}.arena-settlement-score .is-winner{color:#ff3985}.arena-settlement-score>span{font-size:46px;color:#a69bbd}
.arena-settlement-score>.arena-score-digit{display:block;height:88px;width:auto;max-width:none;object-fit:contain;flex:none}
@media(max-width:760px){.arena-settlement-score>.arena-score-digit{height:60px}}
.arena-settlement-targets{display:grid;grid-template-columns:1fr 1fr;gap:64px;max-width:570px;margin:0 auto 20px}
.arena-settlement-target-group{display:flex;justify-content:center;gap:10px}
.arena-settlement-toy{position:relative;display:flex;align-items:center;justify-content:center;width:92px;height:88px;border:1px solid #ddd0ff;border-radius:18px;background:linear-gradient(145deg,#eee7ff,#ffffffdb)}
.arena-settlement-toy>img:first-child{width:78%;height:80%;object-fit:contain}
.arena-settlement-toy .arena-settlement-toy-state{position:absolute;right:-4px;bottom:-4px;width:26px;height:26px;object-fit:contain}
.arena-settlement-toy>.arena-settlement-toy-count{position:absolute;z-index:2;top:10px;right:5px;font:400 23px/1 ClawSystemLocal,sans-serif;color:#9252cf;-webkit-text-stroke:4px #fff;paint-order:stroke fill;text-shadow:0 3px 0 #dcc3f1,0 4px 4px #60307a30;transform:rotate(8deg);pointer-events:none;white-space:nowrap}
@media(max-width:760px){.arena-settlement-toy>.arena-settlement-toy-count{font-size:20px;top:5px;right:3px}}
.arena-settlement-rating{display:flex;align-items:center;justify-content:center;gap:18px;padding:10px 18px;border:1px solid #eee5ff;border-radius:20px;background:linear-gradient(110deg,#eee7ff,#f7f2ff);min-height:88px}
.arena-settlement-rank{display:flex;align-items:center;gap:8px}.arena-settlement-rank>img{width:64px;height:70px;object-fit:contain}.arena-settlement-rank>strong{font-weight:400;font-size:20px;white-space:nowrap}
.arena-settlement-stars{display:flex;align-items:center;justify-content:center;gap:3px;min-width:150px}.arena-settlement-stars>img{width:27px;height:29px;object-fit:contain}.arena-settlement-stars>strong{font-weight:400;font-size:26px}
.arena-settlement-delta{border:1px solid #d8c6ff;background:#f8f2ff;border-radius:30px;font-size:23px;font-weight:400;padding:8px 16px;white-space:nowrap;color:#8255ce}
[data-outcome="win"] .arena-settlement-delta{color:#ff3985;border-color:#ff9fc7;background:#fff2f8}
.arena-settlement-detail{min-height:20px;color:#817198;font-size:13px;margin:10px 0 14px;text-align:center}
#arena-page .arena-settlement-return.platform-enter{display:block;width:min(100%,360px);height:48px;min-height:48px;margin:0 auto;max-width:none;background:linear-gradient(#ff65a2,#ff3985);border:1px solid #ff7fac;border-radius:13px;box-shadow:inset 0 1px #fff,0 3px #e9e5ef;color:#fff;font-size:20px;cursor:pointer}
#arena-page .arena-settlement-return:after{content:'›';position:static;margin-left:12px;background:none;border:0;width:auto;height:auto;transform:none}
.arena-settlement-preview-controls{display:flex;flex-wrap:wrap;gap:8px;padding:14px;background:#f8f5ff;justify-content:center;border-top:1px solid #e7dcfa}.arena-settlement-preview-controls>small{width:100%;font-size:12px;color:#786690}.arena-settlement-preview-controls>button{border:1px solid #d5c2ff;border-radius:10px;padding:6px 12px;color:#624496;background:#fff;cursor:pointer;min-height:36px}
@media(max-width:760px){
 #arena-page .arena-result{padding:0;border-radius:20px}
 #arena-page .arena-settlement-header{min-height:52px;padding:10px 16px}
 #arena-page .arena-settlement-header h2{font-size:23px}
 .arena-settlement-body{padding:18px 14px 24px}
 .arena-settlement-hero{min-height:92px}.arena-settlement-hero>img{width:34px;height:25px}
 #arena-page .arena-settlement-title{font-size:38px;letter-spacing:2px}.arena-settlement-theme{font-size:20px}
 .arena-settlement-versus{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin:6px 0 18px}
 .arena-settlement-score{grid-row:2;grid-column:1/-1;font-size:56px;margin:4px 0 0;gap:14px}.arena-settlement-score>span{font-size:38px}
 .arena-settlement-player:last-child{grid-column:2;grid-row:1}
 #arena-page .arena-settlement-player .arena-player-avatar{width:86px;height:86px;margin:12px}
 #arena-page .arena-settlement-player .arena-player-avatar:after{inset:-12px}
 .arena-settlement-nickname{font-size:14px;padding:4px 8px}
 .arena-settlement-targets{gap:18px;margin-bottom:18px}.arena-settlement-target-group{gap:6px}.arena-settlement-toy{width:66px;height:66px;border-radius:14px}.arena-settlement-toy .arena-settlement-toy-state{width:22px;height:22px}
 .arena-settlement-rating{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 8px;padding:8px 12px;min-height:86px;text-align:left}
 .arena-settlement-rank{grid-column:1;grid-row:1/3;display:grid;grid-template-columns:46px auto;gap:4px}
 .arena-settlement-rank>img{width:46px;height:58px}.arena-settlement-rank>strong{font-size:16px}
 .arena-settlement-stars{grid-column:2;grid-row:2;min-width:0;gap:1px}.arena-settlement-stars>img{width:20px;height:23px}
 .arena-settlement-delta{grid-column:2;grid-row:1;justify-self:center;padding:3px 12px;font-size:19px}
 .arena-settlement-detail{font-size:11px}.arena-settlement-preview-controls{padding:10px}
}
@media(max-width:360px){.arena-settlement-body{padding-inline:10px}.arena-settlement-targets{gap:12px}.arena-settlement-toy{width:56px;height:58px}.arena-settlement-rank>strong{font-size:14px}.arena-settlement-rating{padding:8px}.arena-settlement-stars>img{width:18px}}

#arena-page .arena-settlement-preview-controls>button{width:auto;flex:0 1 auto}
#arena-page .arena-settlement-detail{margin:10px 0 14px}
@media(max-width:760px){#arena-page .arena-result .arena-settlement-title{font-size:38px}}

/* Settlement artwork and stable rows, shared by every outcome and rank. */
#arena-page .arena-settlement-header{gap:16px;background:linear-gradient(#faf7ff,#ebe4ff)}
#arena-page .arena-settlement-header:before,#arena-page .arena-settlement-header:after{content:'';display:block;flex:0 1 82px;height:16px;background:#c5a1ff;mask:linear-gradient(#000,#000) left center/58px 1px no-repeat,url('/game/platform-art/arena-ui-v1/34-decor-star.png') right center/16px 16px no-repeat}
#arena-page .arena-settlement-header:after{transform:scaleX(-1)}
#arena-page .arena-settlement-header h2{white-space:nowrap}
#arena-page .arena-settlement-body{display:grid;grid-template-rows:132px 204px 96px 100px 32px 48px;row-gap:10px;padding:18px 42px 28px;background:#fff9f5 url('/game/platform-art/arena-ui-v1/44-settlement-win-v1.png') center/cover no-repeat}
#arena-page [data-outcome='loss'] .arena-settlement-body{background-image:url('/game/platform-art/arena-ui-v1/45-settlement-loss-v1.png')}
#arena-page [data-outcome='draw'] .arena-settlement-body,#arena-page [data-outcome='void'] .arena-settlement-body{background-image:url('/game/platform-art/arena-ui-v1/46-settlement-draw-v1.png')}
.arena-settlement-body:after{display:none}
#arena-page .arena-settlement-body>div,#arena-page .arena-settlement-body>p,#arena-page .arena-settlement-body>button{position:relative;z-index:1}
#arena-page .arena-settlement-hero{min-height:0;height:132px;display:flex;flex-direction:column;align-items:center;justify-content:center}
#arena-page .arena-settlement-hero>.arena-settlement-crown{width:42px;height:30px;margin:0;visibility:hidden;flex:0 0 30px}
#arena-page [data-outcome='win'] .arena-settlement-crown{visibility:visible}
#arena-page .arena-settlement-hero>.arena-settlement-laurel{position:absolute;inset:50% auto auto 50%;width:198px;max-width:100%;height:auto;aspect-ratio:3/2;object-fit:contain;margin:0;z-index:-1;pointer-events:none}
#arena-page .arena-settlement-laurel.is-left{clip-path:inset(0 50% 0 0);transform:translate(calc(-50% - 60px),-50%)}
#arena-page .arena-settlement-laurel.is-right{clip-path:inset(0 0 0 50%);transform:translate(calc(-50% + 60px),-50%)}
#arena-page [data-outcome='loss'] .arena-settlement-laurel{filter:grayscale(1) sepia(.6) saturate(4) hue-rotate(205deg)}
#arena-page .arena-settlement-hero .arena-settlement-title{font-size:48px;line-height:58px;letter-spacing:2px;margin:0}
#arena-page .arena-settlement-theme{font-size:22px;height:30px;line-height:30px;margin:0}
#arena-page .arena-settlement-confetti{position:absolute;inset:0;width:100%;height:510px;object-fit:cover;object-position:center top;pointer-events:none;z-index:0;animation:arena-confetti-drift 4s ease-in-out infinite alternate}
@keyframes arena-confetti-drift{from{transform:translateY(-5px);opacity:.8}to{transform:translateY(9px);opacity:1}}
#arena-page .arena-settlement-versus{margin:0;height:204px;align-items:start;gap:16px}
#arena-page .arena-settlement-player{height:204px;gap:4px;overflow:hidden}
#arena-page .arena-settlement-player .arena-player-avatar{flex:0 0 112px}
#arena-page .arena-settlement-nickname{height:34px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-sizing:border-box}
#arena-page .arena-settlement-score{height:172px;align-self:start}
#arena-page .arena-settlement-targets{height:96px;width:100%;max-width:570px;margin:0 auto;align-items:start}
#arena-page .arena-settlement-rating{height:100px;min-height:0;margin:0;padding:0 26px 0 24px;display:grid;grid-template-columns:minmax(0,1fr) 155px 130px;gap:14px;border:1.5px solid #fff5dccc;border-radius:24px;background:radial-gradient(ellipse at 18% 0%,#ffffff52,transparent 65%),linear-gradient(150deg,#fffdf838,#fff8e814 52%,#fff9ed29);box-shadow:inset 0 2px 1px #fff,inset 2px 0 3px #ffffffe6,inset -2px -3px 5px #fff9,inset 0 -7px 12px #d2c3a52b,0 2px 1px #907b5840,0 7px 18px #30204c2b;backdrop-filter:blur(10px) saturate(1.1);-webkit-backdrop-filter:blur(10px) saturate(1.1);box-sizing:border-box;overflow:visible}
#arena-page .arena-settlement-rank{height:100px;min-width:0;gap:10px;display:flex;position:relative;align-items:center;padding-left:114px}
#arena-page .arena-settlement-rank>img{position:absolute;left:0;top:-16px;width:104px;height:120px;max-width:none;object-fit:contain;object-position:center;flex:none}
#arena-page .arena-settlement-rank>strong{font-size:22px;white-space:nowrap}
#arena-page .arena-settlement-rank>img,#arena-page .arena-settlement-rank>strong{transform-origin:50% 50%;transform-box:border-box}
#arena-page .arena-settlement-stars{min-width:0;height:36px}
#arena-page .arena-settlement-stars>strong{font-size:26px}
#arena-page .arena-settlement-delta{display:flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:0;width:130px;height:54px;padding:0 10px;border:1px solid #b99aff;border-radius:30px;background:linear-gradient(#eee7ff,#ded2ff);box-shadow:inset 0 2px #fff;color:#7147ca;font-size:27px;line-height:1}
#arena-page [data-outcome='win'] .arena-settlement-delta{border-color:#ff80b3;background:linear-gradient(#fff4fa,#ffd9ec);color:#ff3283}
#arena-page .arena-settlement-detail{height:32px;min-height:0;margin:0;line-height:16px;overflow:hidden;display:flex;align-items:center;justify-content:center}
#arena-page .arena-settlement-return.platform-enter{margin:0 auto}
@media(max-width:760px){
 #arena-page .arena-settlement-header{gap:10px}
 #arena-page .arena-settlement-header:before,#arena-page .arena-settlement-header:after{flex-basis:42px;mask-size:24px 1px,13px 13px}
 #arena-page .arena-settlement-body{grid-template-rows:112px 240px 74px 90px 32px 48px;gap:10px;padding:14px 14px 26px}
 #arena-page .arena-settlement-hero{height:112px}
 #arena-page .arena-settlement-hero>.arena-settlement-crown{width:34px;height:24px;flex-basis:24px}
 #arena-page .arena-settlement-hero>.arena-settlement-laurel{width:168px;height:auto;top:50%}
 #arena-page .arena-settlement-laurel.is-left{transform:translate(calc(-50% - 45px),-50%)}
 #arena-page .arena-settlement-laurel.is-right{transform:translate(calc(-50% + 45px),-50%)}
 #arena-page .arena-settlement-hero .arena-settlement-title{font-size:36px;line-height:48px}
 #arena-page .arena-settlement-theme{font-size:20px;line-height:28px;height:28px}
 #arena-page .arena-settlement-versus{height:240px;grid-template-rows:176px 54px;gap:10px}
 #arena-page .arena-settlement-player{height:176px}
 #arena-page .arena-settlement-player .arena-player-avatar{flex-basis:86px}
 #arena-page .arena-settlement-nickname{flex-shrink:0;height:28px;font-size:14px;line-height:18px;padding:4px 8px}
 #arena-page .arena-settlement-score{height:54px;margin:0;font-size:52px}
 #arena-page .arena-settlement-targets{height:74px;gap:18px}
 #arena-page .arena-settlement-rating{height:90px;grid-template-columns:minmax(0,1fr) 105px;grid-template-rows:42px 34px;gap:0 8px;padding:7px 10px 7px 4px;border-radius:18px}
 #arena-page .arena-settlement-rank{height:90px;grid-row:1/3;grid-column:1;padding-left:86px;align-self:center}
 #arena-page .arena-settlement-rank>img{width:80px;height:90px;top:-12px}
 #arena-page .arena-settlement-rank>strong{font-size:16px}
 #arena-page .arena-settlement-stars{grid-column:2;grid-row:2;height:30px}
 #arena-page .arena-settlement-delta{grid-column:2;grid-row:1;width:105px;height:38px;font-size:23px;align-self:center}
 #arena-page .arena-settlement-confetti{height:440px}
}
@media(max-width:360px){#arena-page .arena-settlement-body{padding-inline:10px}#arena-page .arena-settlement-rank{padding-left:74px}#arena-page .arena-settlement-rank>img{width:72px;height:80px}#arena-page .arena-settlement-rank>strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){#arena-page .arena-settlement-confetti{animation:none}}

/* Search -> matched keeps one identity grid; only the center marker changes. */
#arena-page .arena-pair-state[data-a]{display:block;max-width:480px;padding:20px 18px}
#arena-page .arena-pair-state[data-a]>h2{margin-bottom:12px}
#arena-page .arena-pair-state[data-a]>.arena-state-subtitle{font-size:14px;line-height:21px;margin:6px 0!important}
#arena-page .arena-pair-state[data-a] .arena-pair{display:grid;grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr);max-width:520px;gap:8px;align-items:start;margin:12px auto}
#arena-page .arena-pair-state[data-a] .arena-pair>div{display:grid;grid-template-rows:120px 36px 44px;justify-items:center;align-items:center;align-content:start;gap:4px;width:100%;font-size:16px}
#arena-page .arena-pair-state[data-a] .arena-player-avatar{width:96px;height:96px;margin:12px}
#arena-page .arena-pair-state[data-a] .arena-player-avatar:after{inset:-14px}
#arena-page .arena-pair-state[data-a] .arena-unknown-avatar{width:120px;height:120px;margin:0}
#arena-page .arena-pair-state[data-a] .arena-pair>div>p{margin:0!important;width:100%;font-size:14px;line-height:18px;max-height:36px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
#arena-page .arena-pair-state[data-a] .arena-player-rank img{width:38px;height:44px}
#arena-page .arena-pair-state[data-a] .arena-pair-vs,#arena-page .arena-pair-state[data-a] .arena-pair-dots{width:40px;height:40px;min-height:40px;object-fit:contain;align-self:start;margin:40px 0 0}
#arena-page .arena-pair-state[data-a] .arena-state-note{height:56px;min-height:56px;max-width:440px;width:100%;margin:12px auto!important}
#arena-page .arena-match-destination{max-width:440px;margin:12px auto 0}
#arena-page .arena-match-destination .arena-state-subtitle{margin:0 0 10px!important}
#arena-page .arena-pair-state[data-a] .arena-state-scene{width:100%;height:150px;margin:0;object-position:70% center}
#arena-page .arena-match-destination h3{margin:10px 0 0}
#arena-page .arena-pair-state[data-a]>.arena-secondary{max-width:440px;width:100%;margin:12px auto 0}
@media(min-width:761px){
 #arena-page .arena-pair-state[data-a]{max-width:760px;padding:20px 32px}
 #arena-page .arena-pair-state[data-a]>h2{margin-bottom:6px}
 #arena-page .arena-pair-state[data-a]>.arena-state-subtitle{font-size:15px;line-height:22px}
 #arena-page .arena-pair-state[data-a] .arena-pair{grid-template-columns:minmax(0,1fr) 64px minmax(0,1fr);gap:16px;margin:12px auto}
 #arena-page .arena-pair-state[data-a] .arena-pair>div{grid-template-rows:160px 36px 48px;font-size:18px}
 #arena-page .arena-pair-state[data-a] .arena-player-rank img{width:42px;height:48px}
 #arena-page .arena-pair-state[data-a] .arena-player-avatar{width:128px;height:128px;margin:16px}
 #arena-page .arena-pair-state[data-a] .arena-player-avatar:after{inset:-18px}
 #arena-page .arena-pair-state[data-a] .arena-unknown-avatar{width:160px;height:160px;margin:0}
 #arena-page .arena-pair-state[data-a] .arena-pair>div>p{font-size:16px;line-height:18px;max-height:36px}
 #arena-page .arena-pair-state[data-a] .arena-pair-vs,#arena-page .arena-pair-state[data-a] .arena-pair-dots{width:64px;height:64px;min-height:64px;margin-top:48px}
 #arena-page .arena-pair-state[data-a] .arena-state-scene{height:150px}
}

/* Match compact game HUD glass surface without a compositing halo. */
@media(max-width:600px),(max-height:500px){#arena-page .arena-settlement-rating{backdrop-filter:none;-webkit-backdrop-filter:none;box-shadow:inset 0 2px 1px #fff,inset 2px 0 3px #ffffffe6,inset -2px -3px 5px #fff9,inset 0 -7px 12px #d2c3a52b,0 2px 3px #30204c24}}

/* Stable score slots: outcome digits must never resize the versus columns. */
#arena-page .arena-settlement-score{display:grid;grid-template-columns:72px 24px 72px;width:192px;gap:12px;justify-items:center;align-content:center;box-sizing:border-box}
#arena-page .arena-settlement-score>.arena-score-digit{width:72px;height:88px;object-fit:contain}
@media(max-width:760px){#arena-page .arena-settlement-score{grid-template-columns:50px 20px 50px;width:140px;gap:10px;justify-self:center}#arena-page .arena-settlement-score>.arena-score-digit{width:50px;height:60px}}

/* Separate the two players without changing the target grid geometry. */
#arena-page .arena-settlement-targets{position:relative}
#arena-page .arena-settlement-targets::after{content:"";position:absolute;left:50%;top:6px;bottom:6px;width:1px;background:#c7afe8;transform:translateX(-50%);pointer-events:none}

#arena-page .is-result-heading .platform-page-title{--title-art-w:6.99677;--title-art-h:2.33871;--title-art-x:-3.50323;--title-art-y:-.68387}#arena-page .arena-result .arena-settlement-body:first-child{border-radius:24px 24px 0 0}
@media(max-width:640px){#arena-page .arena-result .arena-settlement-body:first-child{border-top-left-radius:20px;border-top-right-radius:20px}}

.arena-history-scores>.arena-history-score{display:grid;grid-template-columns:40px 12px 40px;gap:8px;align-items:center;justify-items:center;flex-wrap:nowrap}.arena-history-score>.arena-score-digit{display:block;width:40px;height:52px;object-fit:contain}
@media(max-width:640px){.arena-history-scores>.arena-history-score{grid-template-columns:28px 10px 28px;gap:4px}.arena-history-score>.arena-score-digit{width:28px;height:36px}}

.arena-history-stars{display:flex;align-items:center;gap:4px;margin-left:auto}.arena-history-stars img{width:24px;height:24px;object-fit:contain}.arena-history-rating{gap:12px}
@media(max-width:640px){.arena-history-rating{flex-wrap:wrap;gap:8px}.arena-history-stars{gap:2px}.arena-history-stars img{width:19px;height:19px}}

.arena-history-meta>.arena-history-detail{grid-column:1 / -1;grid-template-columns:24px 64px minmax(0,1fr)}
.arena-history-detail>span:last-child{overflow-wrap:anywhere}
@media(max-width:760px){
 .arena-history-meta>.arena-history-detail{grid-template-columns:24px minmax(0,1fr);gap:4px 8px}
 .arena-history-meta>.arena-history-detail>span:last-child{grid-column:1 / -1;grid-row:2;min-width:0}
}

/* Mobile rank label and stars form one centered stack beside the rank artwork. */
@media(max-width:760px){
 #arena-page .arena-settlement-rating{grid-template-columns:80px minmax(0,1fr) 90px;grid-template-rows:1fr 1fr;gap:2px 6px;padding:7px 10px 7px 4px}
 #arena-page .arena-settlement-rank{display:contents}
 #arena-page .arena-settlement-rank>img{position:relative;grid-column:1;grid-row:1/3;left:auto;top:0;align-self:center}
 #arena-page .arena-settlement-rank>strong{grid-column:2;grid-row:1;align-self:end;justify-self:start;line-height:24px}
 #arena-page .arena-settlement-stars{grid-column:2;grid-row:2;align-self:start;justify-self:start;justify-content:flex-start;height:24px;gap:2px}
 #arena-page .arena-settlement-stars>img{width:20px;height:20px;object-fit:contain}
 #arena-page .arena-settlement-delta{grid-column:3;grid-row:1/3;align-self:center;width:90px;font-size:21px}
}
@media(max-width:380px){
 #arena-page .arena-settlement-rating{grid-template-columns:68px minmax(0,1fr) 78px;column-gap:4px;padding-right:8px}
 #arena-page .arena-settlement-rank>img{width:68px;height:80px}
 #arena-page .arena-settlement-stars>img{width:16px;height:16px}
 #arena-page .arena-settlement-delta{width:78px;font-size:20px}
}

/* Arena targets follow the actual room information card; its glass face is shared at runtime. */
body.arena-play #arena-room-hud{transform:none;gap:10px;padding:9px 12px;pointer-events:none}
#arena-room-hud .arena-side>div>span{height:44px;padding:0;background:#ffffff55}
body.arena-play #room #drag-tutorial{display:none!important}
@media(max-width:760px){#arena-room-hud .arena-side>div>span{height:36px}body.arena-play #arena-room-hud{gap:7px;padding:7px 9px}}

.arena-history-side-label{display:flex;flex-direction:column;align-items:center;flex-shrink:0;line-height:1.4}
.arena-history-surrender{display:block;font-size:11px;color:#81739d;white-space:nowrap}

/* Mobile targets flank the operator notice; only dolls and scores are visible. */
@media(max-width:760px){
 body.arena-play #arena-room-hud{left:12px!important;right:12px;width:auto;max-width:none;flex-direction:row;align-items:flex-start;justify-content:space-between;box-sizing:border-box;gap:0;padding:0;background:transparent!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
 #arena-room-hud .arena-side{display:flex;flex-direction:column;align-items:center;gap:4px;padding:5px;border:1px solid #ffffffbd;border-radius:14px;background:var(--arena-target-glass,#ffffff80);backdrop-filter:var(--arena-target-blur,blur(12px));-webkit-backdrop-filter:var(--arena-target-blur,blur(12px))}
 #arena-room-hud .arena-side>b{order:2;justify-content:center;gap:0;white-space:nowrap}
 #arena-room-hud .arena-side>b>span,#arena-room-hud .arena-hud-vs{display:none}
 #arena-room-hud .arena-side strong{font-size:13px;line-height:18px}
 #arena-room-hud .arena-side>div{display:flex;flex-direction:column;align-items:center;gap:4px}
 #arena-room-hud .arena-side>div>span{width:34px;height:34px}
 body.arena-play #room#room.liquid-hud #operator-notice{left:66px;right:66px;transform:none;width:auto;max-width:none;padding:10px 6px}
}

/* Same wording and weight as the machine lobby price. */
#arena-page .arena-fee-unit{margin-left:4px;font-size:16px;font-weight:500;white-space:nowrap;color:#15131d;vertical-align:middle}
@media(max-width:800px){#arena-page .arena-fee-unit{font-size:13px}}
