/* A compact detail card independent of the horizontally scrollable history table. */
.events-panel .event-info-button{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:0;border-radius:10px;background:transparent;color:var(--pa-text,#145b99);cursor:pointer;padding:9px;vertical-align:middle}
.events-panel .event-info-button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round}
.events-panel .event-info-button:hover{background:var(--pa-field,#e9f2fa)}
.events-panel .event-info-button:focus-visible{outline:3px solid #dcad32;outline-offset:-3px}
.events-panel .table-wrap>table.event-detail-enabled :is(th,td).event-info-cell,
.events-panel .table-wrap>table.event-detail-enabled th.event-info-column{width:50px!important;min-width:50px!important;max-width:50px;padding:0 2px!important;text-align:center}
@media(min-width:901px){
 .events-panel .event-detail-enabled th:nth-child(2){width:10%}
 .events-panel .event-detail-enabled th:nth-child(3){width:16%}
 .events-panel .event-detail-enabled th:nth-child(4){width:19%}
 .events-panel .event-detail-enabled th:nth-child(5){width:11%}
 .events-panel .event-detail-enabled th:nth-child(6){width:5%}
 .events-panel .event-detail-enabled th:nth-child(7){width:9%}
 .events-panel .event-detail-enabled th:nth-child(8){width:8%}
 .events-panel .event-detail-enabled th:nth-child(9){width:10%}
 .events-panel .event-detail-enabled th:nth-child(10){width:8%}
}
@media(max-width:1100px),(hover:none) and (pointer:coarse){
 .events-panel .table-wrap>table.event-detail-enabled :is(th,td){min-width:0!important}
 .events-panel .table-wrap>table.event-detail-enabled :is(th,td):nth-child(4){min-width:220px!important}
 .events-panel .table-wrap>table.event-detail-enabled :is(th,td):nth-child(5){min-width:150px!important}
 .events-panel .table-wrap>table.event-detail-enabled :is(th,td):nth-child(7){min-width:115px!important}
 .events-panel .table-wrap>table.event-detail-enabled :is(th,td):nth-child(n+8){min-width:110px!important}
 .events-panel .table-wrap>table.event-detail-enabled :is(th,td):first-child{min-width:50px!important;width:50px!important;padding:0 2px!important}
}
html.event-detail-open,html.event-detail-open body{overflow:hidden}
#event-detail-dialog{box-sizing:border-box;width:min(620px,calc(100vw - 20px));max-width:none;max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px);margin:auto;padding:18px;border:1px solid var(--pa-line,#c4d5e2);border-radius:18px;background:var(--pa-panel,#fff);color:var(--pa-text,#142d43);box-shadow:0 24px 80px #061e3655;font-family:inherit;overflow:auto;overscroll-behavior:contain}
#event-detail-dialog::backdrop{background:#061829b3}
#event-detail-dialog .event-detail-header{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:44px}
#event-detail-dialog h2{font-weight:700;font-family:inherit;font-size:18px;line-height:1.2;margin:0;color:inherit;overflow-wrap:anywhere}
#event-detail-dialog .event-detail-close{flex:0 0 44px;width:44px;height:44px;padding:0;border:1px solid var(--pa-line,#c4d5e2);border-radius:12px;background:var(--pa-field,#f0f5fa);color:inherit;font-family:inherit;line-height:1;font-size:28px;cursor:pointer}
#event-detail-dialog .event-detail-close:focus-visible{outline:3px solid #dcad32;outline-offset:2px}
#event-detail-dialog .event-detail-match{font-size:21px;font-weight:800;line-height:1.2;margin:8px 0 14px;color:inherit;white-space:normal;overflow-wrap:anywhere}
#event-detail-dialog .event-detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0}
#event-detail-dialog .event-detail-field{min-width:0;border:1px solid var(--pa-line,#d3e0eb);border-radius:10px;background:var(--pa-field,#f3f7fb);padding:9px 11px}
#event-detail-dialog dt{font-size:11px;line-height:1.2;color:var(--pa-muted,#5a6c80);margin:0 0 4px;overflow-wrap:anywhere}
#event-detail-dialog dd{font-size:15px;line-height:1.25;font-weight:700;color:inherit;margin:0;white-space:normal;overflow-wrap:anywhere}
#event-detail-dialog [data-outcome="win"]{border-color:#42936b;background:#e5f6ec;color:#155a36}
#event-detail-dialog [data-outcome="loss"]{border-color:#c77070;background:#fceaea;color:#8a2626}
#event-detail-dialog [data-outcome] dt{color:inherit}
html[data-pino-appearance="dark"] #event-detail-dialog [data-outcome="win"]{background:#123c2d;color:#a7efc5}
html[data-pino-appearance="dark"] #event-detail-dialog [data-outcome="loss"]{background:#49262b;color:#ffc4c4}
@media(max-width:420px){
 #event-detail-dialog{padding:12px;width:calc(100vw - 16px);border-radius:14px}
 #event-detail-dialog .event-detail-match{font-size:18px;margin:6px 0 10px}
 #event-detail-dialog .event-detail-grid{gap:6px}
 #event-detail-dialog .event-detail-field{padding:7px 8px}
 #event-detail-dialog dd{font-size:14px}
}
/* On short landscape screens place the eight values in two rows. */
@media(max-height:500px) and (min-width:480px){
 #event-detail-dialog{width:calc(100vw - 16px);padding:8px 12px}
 #event-detail-dialog .event-detail-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
 #event-detail-dialog .event-detail-match{font-size:17px;margin:2px 0 6px}
 #event-detail-dialog .event-detail-field{padding:6px 8px}
 #event-detail-dialog dd{font-size:13px}
 #event-detail-dialog dt{font-size:10px;margin-bottom:3px}
}
@media(max-height:600px) and (max-width:479px){
 #event-detail-dialog{padding:8px 10px}
 #event-detail-dialog .event-detail-grid{gap:5px}
 #event-detail-dialog .event-detail-match{font-size:17px;margin:3px 0 7px}
 #event-detail-dialog .event-detail-field{padding:6px 8px}
 #event-detail-dialog dd{font-size:13px}
}