/* RADIAL Phase 2F — OCR and session responsive layout repair only.
   Preserves Phase 2E strategy, chart, OCR controller, and frequency-grid rendering. */

/* Remove the 2E narrow-side-by-side OCR/session row. These are now full-width rows. */
#dashboard {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-areas:
    "ocr"
    "session"
    "recent"
    "strategies"
    "curve"
    "frequency" !important;
  align-items:stretch;
}

/* The OCR strip must never float across/cover the results when scrolling. */
#dashboard #detectBar.dashboard-ocr {
  display:grid !important;
  position:static !important;
  top:auto !important;
  inset:auto !important;
  z-index:auto !important;
  width:100%;
  min-width:0;
  min-height:62px !important;
  grid-template-columns:minmax(0,1fr) auto !important;
  grid-template-rows:auto auto;
  grid-template-areas:"state actions" "meta actions";
  gap:3px 12px;
  align-content:center;
  align-items:center;
  padding:8px 12px !important;
  box-shadow:0 3px 12px #392e1a0e !important;
}
#dashboard #detectBar #detectState {
  grid-area:state;
  min-width:0;
  max-width:100%;
  line-height:1.25;
}
#dashboard #detectBar #detectMeta {
  grid-area:meta;
  min-width:0;
  line-height:1.25;
  overflow-wrap:break-word;
}
#dashboard #detectBar #detectActions {
  grid-area:actions;
  grid-row:auto !important;
  grid-column:auto !important;
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  align-items:center;
  max-width:100%;
  min-width:0;
  gap:4px;
}
#dashboard #detectBar #detectActions button {
  flex:0 0 auto;
  min-height:34px !important;
  white-space:nowrap;
}
#dashboard #detectBar #detectActions video {
  flex:0 0 auto;
  max-width:55px;
  max-height:30px;
}

/* A compact, independent, full-width session card replaces the cropped half-card. */
#dashboard .dashboard-session {
  display:block !important;
  min-height:0 !important;
  padding:8px 12px !important;
}
#dashboard .dashboard-session > h2 { margin:0 0 5px !important; }
#dashboard #sessionMetrics {
  grid-template-columns:repeat(6,minmax(0,1fr)) !important;
  gap:5px 9px !important;
}
#dashboard #sessionMetrics .metric { min-width:0; }
#dashboard #sessionMetrics .metric label {
  font-size:9.5px !important;
  line-height:1.2;
  overflow-wrap:break-word;
}
#dashboard #sessionMetrics .metric b {
  display:block;
  font-size:clamp(13px,1.65vw,18px) !important;
  overflow-wrap:normal;
}
#dashboard #sessionFoot { margin-top:6px !important; padding-top:5px !important; }
#dashboard .dashboard-recent { min-height:0; }

/* At narrower Split View widths, OCR actions move BELOW the capture status
   instead of overflowing the neighbouring content. */
@media (max-width:680px) {
  #dashboard #detectBar.dashboard-ocr {
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto auto auto;
    grid-template-areas:"state" "meta" "actions";
    min-height:0 !important;
    row-gap:5px;
  }
  #dashboard #detectBar #detectActions { justify-content:flex-start; }
  #dashboard #sessionMetrics { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
}
@media (max-width:380px) {
  #dashboard #sessionMetrics { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  #dashboard #detectBar #detectActions button { font-size:9px !important; padding:4px 5px !important; }
}