/* Scoped UI only: no game viewport, body scrolling or canvas rules. */
.cmg-analytics { display: inline-flex; position: static; flex: 0 1 auto; min-width: 0; max-width: 100%; vertical-align: middle; }
.cmg-analytics > button, .cmg-analytics-dialog button { appearance: none; position: static; box-sizing: border-box; display: inline-block; min-width: 0; min-height: 36px; width: auto; height: auto; margin: 0; padding: 7px 10px; border: 1px solid #9c9d90; border-radius: 2px; background: #f5f3e9; color: #303b32; font: 12px/1.4 system-ui, sans-serif; font-family: inherit; letter-spacing: normal; text-transform: none; white-space: normal; cursor: pointer; box-shadow: none; }
.cmg-analytics > button:focus-visible, .cmg-analytics-dialog :focus-visible { outline: 3px solid #4b7594; outline-offset: 2px; }
/* A content-sized non-modal panel. There is no viewport-sized hit target. The
   navigation row above it and every point outside it remain usable. */
.cmg-analytics-dialog { position: fixed; z-index: 10000; inset: auto; top: calc(env(safe-area-inset-top, 0px) + 64px); left: max(10px, env(safe-area-inset-left, 0px)); right: max(10px, env(safe-area-inset-right, 0px)); box-sizing: border-box; width: min(420px, calc(100% - 20px - env(safe-area-inset-left, 0px) - env(safe-area-inset-right, 0px))); max-width: 420px; height: fit-content; max-height: calc(100dvh - 84px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); overflow: auto; overscroll-behavior: contain; margin: 0 auto; padding: 12px; border: 1px solid #9c9d90; border-radius: 2px; background: #f7f5eb; color: #303b32; box-shadow: 0 3px 0 #20281e18; font: 12px/1.5 system-ui, sans-serif; font-family: inherit; text-align: left; letter-spacing: normal; text-transform: none; }
.cmg-analytics-dialog[hidden], .cmg-analytics-dialog [hidden] { display: none; }
.cmg-analytics-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.cmg-analytics-dialog h2 { min-width: 0; margin: 0; color: inherit; font: 650 14px/1.4 system-ui, sans-serif; font-family: inherit; letter-spacing: normal; }
.cmg-analytics-heading button { flex: 0 0 auto; min-height: 36px; margin: -6px -6px -6px 0; border-color: transparent; background: transparent; }
.cmg-analytics-dialog p { margin: 8px 0; color: inherit; font: inherit; }
.cmg-analytics-dialog a { color: #315a6c; text-decoration: underline; font: inherit; }
.cmg-analytics-actions { display: flex; gap: 8px; margin-top: 10px; }
.cmg-analytics-actions button { flex: 1 1 0; min-height: 40px; font-weight: 600; }
.cmg-analytics-details { margin-top: 6px; border: 0; background: transparent; color: inherit; }
.cmg-analytics-details > summary { min-height: 32px; box-sizing: border-box; padding: 7px 0 0; color: #52604f; cursor: pointer; font: inherit; }
.cmg-analytics-details > button { min-height: 40px; margin-top: 10px; }
.cmg-analytics-status { border-top: 1px solid #c6c5b8; padding-top: 8px; }
@media (max-height: 420px) { .cmg-analytics-dialog { top: calc(env(safe-area-inset-top, 0px) + 48px); max-height: calc(100dvh - 60px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); } }