/*
  Regional Intelligence Dashboard — Premium Education UI Lock v66.1.3
  Additive presentation-only refinements over v66.1.2 staging.
  Do not modify React roots, listener logic, Supabase access, official branding or role routes.
*/
:root {
  --ri-v6613-control-touch: 42px;
  --ri-v6613-tile-radius: 15px;
  --ri-v6613-divider: rgba(148,163,184,.24);
}
/* Rounded SVG strokes. Constrain to navigation icons, not chart glyphs or official marks. */
.premium-nav-icon svg,
.premium-menu-search svg {
  stroke-linecap: round;
  stroke-linejoin: round;
}
.premium-nav-icon svg {
  max-width:20px;
  max-height:20px;
  flex-shrink:0;
}
/* Keep navigation labels with icons and prevent the right chevron from squeezing text. */
.premium-nav-item { min-width:0; }
.premium-nav-label { min-width:0; overflow-wrap:break-word; }
.premium-nav-arrow { margin-left:auto; flex-shrink:0; }
.premium-nav-scroll { overscroll-behavior:contain; scrollbar-gutter:stable; }
/* Avoid needless card stretching in independent insights grids. */
main .grid > .infographic-card { height:auto; align-self:start; }
main .infographic-card :is(h2,h3,p) { overflow-wrap:break-word; }
/* Accessible field labels and compact action rows without swapping their hierarchy. */
main :is(input,select,textarea) { min-width:0; }
main :is(button,a[role="button"]) { overflow-wrap:break-word; }
main :is(button,a[role="button"]):focus-visible,
.premium-nav-item:focus-visible,
.premium-nav-group-button:focus-visible {
  outline:2px solid #0891b2;
  outline-offset:2px;
}
/* Protect charts, tables, and modal content from intrinsic-minimum width overflow. */
main .grid > *, main [class*="grid-cols-"] > * { min-width:0; }
main .recharts-responsive-container { max-width:100%; }
main .overflow-x-auto { scrollbar-width:thin; }
main :is(td,th) { overflow-wrap:normal; }
/* Preserve crests/logos in contain mode and allow photographs to fill designated cover frames. */
main img[class*="object-cover"],
main img[class*="rounded-full"] { object-fit:cover; }
/* Preserve the existing sticky header during sidebar/viewport transitions. */
main > header.sticky { isolation:isolate; }
@media (max-width: 767.98px) {
  .premium-nav-item { min-height:44px!important; }
  main :is(button,a[role="button"]):not([class*="rounded-full"]) { min-height:44px; }
  main :is(input:not([type="checkbox"]):not([type="radio"]),select) { min-height:44px; }
  main [role="dialog"] { max-height:min(94vh,94dvh); }
  .premium-sidebar { padding-bottom:env(safe-area-inset-bottom,0px); }
  main > header.sticky { padding-top:max(9px,env(safe-area-inset-top,0px))!important; }
  main .infographic-card :is(h3,p) { overflow-wrap:anywhere; }
}
@media (max-width: 359.98px) {
  main > div[class*="p-4"] { padding-inline:9px!important; }
  .premium-nav-label { font-size:12px!important; }
  main > header.sticky { min-width:0; }
}
@media (prefers-reduced-motion:reduce) {
  .premium-nav-item, .premium-nav-group-button,
  main :is(button,a,input,select,textarea) { scroll-behavior:auto; transition-duration:0.01ms!important; animation-duration:0.01ms!important; }
}