/* Responsive shell and RedLine-only access controls. Loaded after the core theme. */
html, body { max-width: 100%; overflow-x: clip; }
.app { display: block; min-height: 100vh; max-width: 100%; overflow-x: clip; }
main { width: auto; min-width: 0; }
.content { width: 100%; max-width: 1680px; margin: 0 auto; box-sizing: border-box; }
.content > *, .panel, .ops-section, .ops-application-list { min-width: 0; max-width: 100%; }
.incident { grid-template-columns: auto minmax(0, 1fr) auto; }
.incident > div:nth-child(2) { min-width: 0; }
.incident p { overflow-wrap: anywhere; }
.incident-meta { display: flex; flex-wrap: wrap; }
.actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .45rem; }
.actions .danger { border-color: rgba(255, 74, 90, .58); color: #ff8792; background: rgba(255, 44, 64, .08); }

.access-list { display: grid; gap: .85rem; padding: 1rem; }
.access-card { border: 1px solid rgba(255,255,255,.09); background: rgba(255,255,255,.025); padding: 1rem; display: grid; grid-template-columns: minmax(180px,.8fr) minmax(280px,1.7fr) auto; gap: 1rem; align-items: center; }
.access-person strong,.access-person span { display: block; }
.access-person span { color: #78909b; margin-top: .2rem; }
.access-state { display: inline-flex !important; width: fit-content; padding: .18rem .45rem; margin-top: .55rem !important; border: 1px solid rgba(255,255,255,.13); font-size: .68rem; letter-spacing: .08em; }
.access-state.pending { color: #ffb2b9; border-color: rgba(255,74,90,.45); }
.group-options { display: flex; flex-wrap: wrap; gap: .45rem; }
.group-chip { display: inline-flex; align-items: center; gap: .35rem; padding: .4rem .58rem; border: 1px solid color-mix(in srgb, var(--group-color) 52%, transparent); background: color-mix(in srgb, var(--group-color) 9%, transparent); cursor: pointer; font-size: .76rem; }
.group-chip input { accent-color: var(--group-color); }
.access-actions { display: flex; gap: .5rem; flex-direction: column; min-width: 128px; }

@media (max-width: 1050px) {
  .metrics { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .incident { grid-template-columns: auto minmax(0,1fr); }
  .incident .actions { grid-column: 1 / -1; justify-content: flex-start; }
  .access-card { grid-template-columns: 1fr; }
  .access-actions { flex-direction: row; }
}

@media (max-width: 700px) {
  html, body { overflow-x: hidden; }
  .rail { width: 78px; }
  .rail .brand-copy,.rail .nav-copy,.rail .nav-label,.rail .nav-item b,.rail .identity-copy { display: none; }
  .rail .brand { justify-content: center; }
  .rail .brand img { margin: 0; }
  .rail .nav-item,.rail .commandline-link { justify-content: center; padding-left: 0; padding-right: 0; }
  .rail-bottom { padding-left: .55rem; padding-right: .55rem; }
  main { margin-left: 78px; }
  .topbar { padding-left: 1rem; padding-right: 1rem; }
  .content { padding: 1.25rem 1rem 2.5rem; }
  .page-heading { align-items: flex-start; flex-direction: column; gap: .9rem; }
  .page-heading h1 { font-size: clamp(2rem, 10vw, 3rem); }
  .metrics { grid-template-columns: 1fr; }
  .panel-head { align-items: flex-start; gap: .7rem; flex-wrap: wrap; }
  .incident { grid-template-columns: 1fr; }
  .incident .severity { width: fit-content; }
  .incident .actions { grid-column: auto; }
  .incident-meta { max-width: 100%; gap: .35rem .65rem; }
  .actions button { flex: 1 1 140px; }
  .topbar > div:first-child span,.topbar > div:first-child i { display: none; }
}