/* Innings / result dialog — compact gold stadium sheet, no scroll */
body dialog#modal.result-dialog,
body dialog#modal:has(.result-sheet){
  box-sizing:border-box!important;
  width:min(360px,calc(100vw - 28px))!important;
  max-width:calc(100vw - 28px)!important;
  max-height:none!important;
  margin:auto!important;
  padding:24px 6px 6px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
  overflow-x:visible!important;
  overflow-y:visible!important;
  color:#fff!important;
  font-family:'Manrope',Arial,sans-serif!important;
  animation:resultIn .28s ease both!important;
}
body dialog#modal.result-dialog::backdrop,
body dialog#modal:has(.result-sheet)::backdrop{
  background:#020b14e0!important;
  backdrop-filter:blur(12px)!important;
  -webkit-backdrop-filter:blur(12px)!important;
}
@keyframes resultIn{
  from{opacity:0;transform:translateY(12px) scale(.96)}
  to{opacity:1;transform:none}
}

body dialog#modal.result-dialog > form[method="dialog"],
body dialog#modal:has(.result-sheet) > form[method="dialog"]{
  position:absolute!important;
  top:0!important;right:0!important;
  height:auto!important;width:auto!important;
  margin:0!important;z-index:6!important;
  pointer-events:none;
}
body dialog#modal.result-dialog > form[method="dialog"] .close,
body dialog#modal:has(.result-sheet) > form[method="dialog"] .close,
body dialog#modal.result-dialog .close,
body dialog#modal:has(.result-sheet) .close{
  pointer-events:auto;
  position:absolute!important;
  top:6px!important;right:0!important;
  float:none!important;margin:0!important;
  width:36px!important;height:36px!important;
  border-radius:50%!important;
  border:2.5px solid #f6d76a!important;
  background:radial-gradient(circle at 35% 28%,#fff1a8,#ffd24a 55%,#c99628 100%)!important;
  color:#1a1204!important;
  font:900 18px/1 Arial,sans-serif!important;
  display:grid!important;place-items:center!important;
  padding:0!important;
  box-shadow:0 4px 14px #0008,0 0 0 3px #f0c84a33,inset 0 1px 0 #fff8!important;
  z-index:6!important;
}
body dialog#modal.result-dialog #modalcontent,
body dialog#modal:has(.result-sheet) #modalcontent,
body dialog#modal.result-dialog .dialog-body,
body dialog#modal:has(.result-sheet) .dialog-body{
  padding:0!important;margin:0!important;
  background:transparent!important;
  min-width:0!important;text-align:center!important;
  overflow:visible!important;
}

.result-sheet{
  position:relative;
  box-sizing:border-box;
  width:100%;
  padding:22px 16px 16px;
  border-radius:18px;
  border:3px solid transparent;
  background:
    linear-gradient(160deg,#0a2f52 0%,#071f38 48%,#041528 100%) padding-box,
    linear-gradient(135deg,#ffe9a0 0%,#f0c145 22%,#c9972a 48%,#ffe07a 72%,#d4a63a 100%) border-box;
  box-shadow:
    0 24px 60px #000c,
    inset 0 1px 0 #ffffff22,
    inset 0 -18px 36px #0004,
    -8px 0 22px #2ad0ff2e,
    8px 0 22px #2ad0ff2e;
  overflow:visible;
  text-align:center;
}
.result-sheet:before,
.result-sheet:after{
  content:"";
  position:absolute;
  top:18%;bottom:18%;
  width:3px;border-radius:3px;
  background:linear-gradient(180deg,transparent,#5ce8ff,transparent);
  box-shadow:0 0 12px 3px #3ad7ff77;
  pointer-events:none;
}
.result-sheet:before{left:-2px}
.result-sheet:after{right:-2px}

.result-sheet-tab{
  position:absolute;
  top:-16px;left:50%;transform:translateX(-50%);
  z-index:3;
  min-width:118px;
  padding:6px 22px 7px;
  text-align:center;
  font:800 10px/1 'Manrope',Arial,sans-serif;
  letter-spacing:.18em;
  color:#f4f8ff;
  text-transform:uppercase;
  background:
    linear-gradient(180deg,#0d2744 0%,#071a30 100%) padding-box,
    linear-gradient(90deg,#e8c35a,#ffd86a 40%,#c9962e 100%) border-box;
  border:2px solid transparent;
  clip-path:polygon(10% 0,90% 0,100% 100%,0 100%);
  box-shadow:0 4px 12px #0007;
  white-space:nowrap;
}

.result-sheet-body{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0;
  padding-top:4px;
}

.result-sheet-title{
  margin:4px 0 0;
  font:800 italic clamp(22px,5.5vw,28px)/1 Impact,'Arial Black','Bebas Neue',sans-serif;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:#fff;
  text-shadow:0 2px 0 #03101fcc,0 0 20px #5ecfff44;
}
.result-sheet-title:after{
  content:"";
  display:block;
  width:56px;height:2px;margin:8px auto 0;
  border-radius:2px;
  background:linear-gradient(90deg,transparent,#ffe34a,#fff8,#ffe34a,transparent);
  box-shadow:0 0 8px #ffd43a88;
}

.result-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:6px;
  width:100%;
  margin-top:12px;
}
.result-stat{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  min-height:54px;
  padding:6px 2px;
  border-radius:10px;
  border:1.5px solid #3db7e888;
  background:linear-gradient(165deg,#0d3a5e,#082744);
  box-shadow:inset 0 1px 0 #ffffff14;
}
.result-stat b{
  font:900 22px/1 Impact,'Arial Black',sans-serif;
  color:#fff;
  text-shadow:0 1px 0 #041628;
}
.result-stat span{
  font:800 8px/1 'Manrope',Arial,sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#9ec8e4;
}
.result-stat-runs{
  border-color:#f0c145aa;
  background:linear-gradient(165deg,#3a2e12,#1a2840);
}
.result-stat-runs b{color:#ffe34a;text-shadow:0 0 12px #ffd43a66,0 1px 0 #3a2808}
.result-stat-six{
  border-color:#3ddc7988;
  background:linear-gradient(165deg,#0d3d2a,#0a3354);
}
.result-stat-six b{color:#7dffb0}
.result-stat-four b{color:#9ad4ff}

.result-meta{
  grid-column:1 / -1;
  margin:2px 0 0!important;
  font:600 11px/1.3 'Manrope',Arial,sans-serif!important;
  color:#9ec8e4!important;
  letter-spacing:.02em;
}

.result-sheet-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  width:100%;
  margin-top:12px;
}
.result-sheet-extra{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  width:100%;
  margin-top:8px;
}

.result-btn{
  appearance:none;
  box-sizing:border-box;
  border:0;
  cursor:pointer;
  min-height:42px;
  padding:10px 12px;
  border-radius:11px;
  font:800 13px/1.2 'Manrope',Arial,sans-serif;
  letter-spacing:.05em;
  text-transform:uppercase;
  transition:transform .12s ease,filter .12s ease;
  width:100%;
}
.result-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}
.result-btn:active{transform:translateY(1px) scale(.98)}
.result-btn:focus-visible{outline:2px solid #ffe34a;outline-offset:2px}

.result-btn-primary{
  color:#082747;
  background:linear-gradient(160deg,#fff1a0 0%,#ffd24a 42%,#f0b820 100%);
  border:1px solid #ffe98a;
  box-shadow:0 3px 0 #b17a12,0 8px 18px #ffc92933,inset 0 1px 0 #fff8;
}
.result-btn-secondary{
  color:#e8f6ff;
  background:linear-gradient(165deg,#0d3a5e,#082744);
  border:2px solid #3db7e8;
  box-shadow:inset 0 1px 0 #ffffff1a,0 6px 14px #0006;
}
.result-btn-ghost{
  min-height:36px;
  padding:8px 12px;
  color:#e8f6ff;
  background:#0a2f5088;
  border:1.5px solid #5ecfff88;
  font-size:12px;
  box-shadow:none;
}
.result-link{
  appearance:none;
  border:0;
  background:none;
  color:#9ec8e4;
  font:700 12px/1 'Manrope',Arial,sans-serif;
  letter-spacing:.04em;
  cursor:pointer;
  padding:2px 6px;
  text-decoration:underline;
  text-underline-offset:3px;
}
.result-link:hover{color:#ffe34a}

@media(max-width:400px){
  .result-sheet{padding:20px 12px 14px;border-radius:16px}
  .result-stat{min-height:48px}
  .result-stat b{font-size:18px}
  .result-btn{min-height:40px;font-size:12px}
}
@media(orientation:landscape) and (max-height:420px){
  body dialog#modal.result-dialog,
  body dialog#modal:has(.result-sheet){padding:18px 4px 4px!important}
  .result-sheet{padding:16px 12px 12px}
  .result-sheet-title{font-size:20px;margin-top:0}
  .result-sheet-title:after{margin-top:6px}
  .result-stats{margin-top:8px;gap:4px}
  .result-stat{min-height:42px;padding:4px 2px}
  .result-stat b{font-size:16px}
  .result-sheet-actions{margin-top:8px}
  .result-sheet-extra{margin-top:4px}
  .result-btn{min-height:36px;padding:6px 10px;font-size:11px}
  .result-btn-ghost{min-height:30px}
}
@media(prefers-reduced-motion:reduce){
  body dialog#modal.result-dialog,
  body dialog#modal:has(.result-sheet){animation:none!important}
}