/* A distinct change of ends, inside the same fixed board frame. */
.board.online-board.innings-change{background-color:#183e31;background-image:radial-gradient(ellipse at 50% 40%,#d8b66524,transparent 68%)}
body .page .layout .board.online-board.innings-change #arena{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0;padding:20px 24px;min-height:0;overflow:hidden}
.innings-change .match-strip{visibility:hidden;pointer-events:none}
.innings-handover{width:min(580px,100%);margin:auto;text-align:center;animation:innings-arrive .4s ease-out both}
.innings-kicker{font-size:11px;letter-spacing:3px;font-weight:700;color:#e9cc87;margin:0 0 22px}
.innings-role-switch{display:flex;justify-content:center;align-items:center;gap:24px;height:108px;margin:0 auto 20px}
.innings-role-before{opacity:.38;transform:scale(.8);animation:innings-role-out .7s ease-out both}
.innings-role-before .role-icon{width:48px;height:48px}
.innings-swap-arrow{font:400 38px/1 'Space Grotesk',sans-serif;color:#edcd87}
.innings-role-after{display:grid;place-items:center;width:108px;height:108px;border:1px solid #efd28a65;background:#f2d48e12;border-radius:50%;box-shadow:0 0 50px #e2bf5c18;animation:innings-role-in .65s .12s cubic-bezier(.2,.8,.2,1) both}
.innings-role-after .role-icon{height:78px;width:78px;flex-basis:78px}
body .board .innings-handover h2{margin:0;color:#ffebba;line-height:1;letter-spacing:-2px;font-family:'Space Grotesk',sans-serif}
.innings-handover h2>span{display:block;font-size:21px;font-weight:500;letter-spacing:0;margin-bottom:8px;color:#d9dec5}
.innings-handover h2>strong{display:block;font-size:clamp(42px,6vw,76px);font-weight:700;text-shadow:0 4px 0 #0f2f2855}
.innings-objective{display:flex;align-items:baseline;justify-content:center;gap:10px;border-block:1px solid #e6cb8738;padding:16px 0;margin:24px auto 12px;max-width:330px;color:#ffe4a4;font:500 23px/1.1 'Space Grotesk',sans-serif}
.innings-objective strong{font-size:46px;font-weight:700}
.innings-allowance{font-size:14px;color:#e5e7d2;margin:0}.innings-allowance span{margin:0 8px;color:#d6b872}
.innings-summary{font-size:12px;line-height:1.4;color:#b9ccb4;margin:10px 0 0;overflow-wrap:anywhere}
.innings-next{color:#e5ca8d;font-size:13px;margin-top:26px}
body .page .layout .board.innings-change .online-footer{height:auto;margin:4px 0 0;flex:none}
@keyframes innings-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes innings-role-out{from{opacity:.8;transform:scale(1)}to{opacity:.38;transform:scale(.8)}}
@keyframes innings-role-in{from{opacity:0;transform:translateY(24px) scale(.78)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:800px){
 .innings-kicker{font-size:10px;margin-bottom:18px}
 .innings-role-switch{height:94px;gap:20px;margin-bottom:22px}.innings-role-after{width:94px;height:94px}.innings-role-after .role-icon{width:68px;height:68px;flex-basis:68px}
 .innings-handover h2>span{font-size:18px}.innings-handover h2>strong{font-size:clamp(37px,10vw,58px)}
 .innings-objective{font-size:21px;margin-top:22px;padding:12px 0}.innings-objective strong{font-size:40px}.innings-next{margin-top:22px}
}
@media(max-width:1024px) and (max-height:500px) and (orientation:landscape){
 body .page .layout .board.online-board.innings-change #arena{padding:8px 20px}
 .innings-change .match-strip{display:none!important}
 .innings-handover{max-width:680px;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto;column-gap:30px;align-items:center}
 .innings-kicker{grid-column:1;grid-row:1;font-size:9px;margin:0 0 6px}
 .innings-role-switch{grid-column:1;grid-row:2;height:70px;margin:0;gap:12px}.innings-role-after{width:66px;height:66px}.innings-role-after .role-icon{width:48px;height:48px;flex-basis:48px}.innings-role-before .role-icon{width:30px;height:30px}
 .innings-handover h2{grid-column:1;grid-row:3}.innings-handover h2>span{font-size:12px;margin:4px 0}.innings-handover h2>strong{font-size:32px}
 .innings-objective{grid-column:2;grid-row:1/3;margin:0 0 4px;padding:10px 0;width:100%;font-size:20px}.innings-objective strong{font-size:38px}
 .innings-allowance{grid-column:2;grid-row:3;font-size:12px}.innings-summary{grid-column:2;grid-row:4;margin:4px 0 0;font-size:10px}.innings-next{display:none}
 body .page .layout .board.innings-change .online-footer{height:28px;margin:0}.innings-change .online-text{min-height:28px;padding:4px;font-size:10px}
}
@media(prefers-reduced-motion:reduce){.innings-handover,.innings-role-before,.innings-role-after{animation:none!important}}