body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.table-wrap, .admin-table-wrap) {
  overflow-x: auto;
  border: 1px solid var(--fs-border);
  border-radius: var(--fs-radius-md);
  background: var(--fs-bg-panel);
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table, .admin-table-wrap table) {
  width: 100%;
  border-collapse: collapse;
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table th, .data-table td, .admin-table-wrap th, .admin-table-wrap td) {
  padding: 12px;
  border-bottom: 1px solid var(--fs-border);
  text-align: left;
  vertical-align: top;
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table th, .admin-table-wrap th) {
  color: var(--fs-muted);
  background: #eaf1f2;
  font-size: 0.76rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table tr:last-child td, .admin-table-wrap tr:last-child td) {
  border-bottom: 0;
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.table-wrap--responsive-fit) {
  overflow-x: auto;
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-fit) {
  min-width: 0;
  table-layout: fixed;
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-fit th, .data-table--responsive-fit td) {
  padding: 8px 9px;
  font-size: 0.82rem;
  line-height: 1.22;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-fit th) {
  font-size: 0.7rem;
  letter-spacing: 0.02em;
  line-height: 1.12;
}

@media (max-width: 760px) {
  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-fit) {
    min-width: 760px;
  }
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.table-wrap--responsive-cards) {
  overflow-x: auto;
  container-type: inline-size;
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards) {
  min-width: 0;
  table-layout: fixed;
}

body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards th, .data-table--responsive-cards td) {
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

@media (max-width: 1440px) {
  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.table-wrap--responsive-cards) {
    overflow-x: visible;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards) {
    display: block;
    width: 100%;
    min-width: 0;
    border: 0;
    background: transparent;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards thead) {
    display: none;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards tbody) {
    display: grid;
    gap: 10px;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards tr) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--fs-border);
    border-radius: var(--fs-radius-md);
    background: var(--fs-bg-panel);
    box-shadow: var(--fs-shadow-sm);
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards tbody tr:hover) {
    background: var(--fs-bg-panel-muted);
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards td) {
    display: grid;
    grid-template-columns: minmax(92px, 0.38fr) minmax(0, 1fr);
    gap: 8px;
    min-width: 0;
    padding: 8px 10px;
    border-bottom: 1px solid var(--fs-border);
    font-size: 0.86rem;
    line-height: 1.28;
    white-space: normal;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards td::before) {
    content: attr(data-label);
    color: var(--fs-muted);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.02em;
    line-height: 1.15;
    text-transform: uppercase;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards td[colspan]) {
    grid-column: 1 / -1;
    display: block;
    padding: 12px;
    text-align: center;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards td[colspan]::before) {
    content: none;
  }
}

@container (max-width: 1120px) {
  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards) {
    display: block;
    width: 100%;
    min-width: 0;
    border: 0;
    background: transparent;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards thead) {
    display: none;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards tbody) {
    display: grid;
    gap: 10px;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards tr) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: hidden;
    border: 1px solid var(--fs-border);
    border-radius: var(--fs-radius-md);
    background: var(--fs-bg-panel);
    box-shadow: var(--fs-shadow-sm);
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards tbody tr:hover) {
    background: var(--fs-bg-panel-muted);
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards td) {
    display: grid;
    grid-template-columns: minmax(92px, 0.38fr) minmax(0, 1fr);
    gap: 8px;
    min-width: 0;
    padding: 8px 10px;
    border-bottom: 1px solid var(--fs-border);
    font-size: 0.86rem;
    line-height: 1.28;
    white-space: normal;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards td::before) {
    content: attr(data-label);
    color: var(--fs-muted);
    font-size: 0.7rem;
    font-weight: 900;
    letter-spacing: 0.02em;
    line-height: 1.15;
    text-transform: uppercase;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards td[colspan]) {
    grid-column: 1 / -1;
    display: block;
    padding: 12px;
    text-align: center;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards td[colspan]::before) {
    content: none;
  }
}

@media (max-width: 760px) {
  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards tr) {
    grid-template-columns: 1fr;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards td) {
    grid-template-columns: minmax(84px, 0.36fr) minmax(0, 1fr);
  }
}

@container (max-width: 760px) {
  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards tr) {
    grid-template-columns: 1fr;
  }

  body[data-flowstack-shell] :where(.platform-main, .main-stack, .auth-card, .pricing-shell, .demo-shell, .public-shell) :where(.data-table--responsive-cards td) {
    grid-template-columns: minmax(84px, 0.36fr) minmax(0, 1fr);
  }
}