/* Shared density and layout contract; legacy screens consume the same tokens. */
[hidden] { display: none !important; }
body { font-size: var(--text-base); line-height: var(--line-body); }
.sidebar { scrollbar-gutter: stable; }
.sidebar-nav { padding: var(--space-4) var(--space-3); }
.nav-group + .nav-group { margin-top: var(--space-5); }
.nav-group-title { font-size: 11px; letter-spacing: .06em; }
.nav-link { min-height: 36px; padding: var(--space-2); font-size: var(--text-sm); gap: var(--space-3); }
.nav-link[aria-current="page"] { box-shadow: inset 3px 0 0 var(--primary); }
.nav-link:focus-visible { outline-color: #c7d2fe; outline-offset: -3px; }
.nav-icon { flex-shrink: 0; }
.brand { padding: var(--space-4); }
.brand-mark { box-shadow: none; color: var(--on-primary); }
.mobile-menu-button { display: grid; flex-shrink: 0; }
.sidebar-close { display: none; }
.content { padding: var(--space-6); min-width: 0; }
/* Main is a programmatic route/skip-link target; interactive controls keep focus rings. */
#app-content:focus { outline: none; }
.workspace { min-width: 0; }
.page-stack { gap: var(--space-5); }
.page-intro { gap: var(--space-4); }
.page-intro h2, .page-intro h1 { font-size: var(--text-xl); margin: 0; letter-spacing: -.02em; }
.page-intro p { font-size: var(--text-base); margin-top: var(--space-1); max-width: 72ch; }
.page-actions { flex-wrap: wrap; gap: var(--space-2); }
.breadcrumbs ol { display: flex; flex-wrap: wrap; list-style: none; gap: var(--space-2); padding: 0; margin: 0 0 var(--space-1); font-size: var(--text-xs); color: var(--text-soft); }
.breadcrumbs li + li::before { content: "/"; margin-right: var(--space-2); }
.breadcrumbs a:hover { text-decoration: underline; }
.page-heading h1 { font-size: var(--text-lg); }
.foundation-page .panel-body { padding: var(--space-4); }
.panel-title { font-size: var(--text-base); }
.panel-subtitle, .cell-stack small { font-size: var(--text-xs); }
.status-badge { font-size: var(--text-xs); }
.foundation-page .empty-state { min-height: 220px; padding: var(--space-6); }
.foundation-note { margin: 0; color: var(--text-soft); font-size: var(--text-sm); }
.state-title { font-size: var(--text-lg); }
.state-message { font-size: var(--text-base); max-width: 64ch; }
.button { font-size: var(--text-sm); border-radius: var(--radius-sm); }
.button:not(.button--secondary):not(.button--danger):not(.button--ghost) { color: var(--on-primary); }
.button--danger { background: var(--danger); color: var(--on-primary); }
.icon-button { min-width: 36px; min-height: 36px; }
.table-toolbar { gap: var(--space-3); padding: var(--space-4); flex-wrap: wrap; }
.table-card { overflow: visible; }
.table-toolbar-actions { flex-wrap: wrap; gap: var(--space-2); }
.table-toolbar-copy small, .table-footer { font-size: var(--text-xs); }
.table-scroll { overflow: auto; max-height: 65vh; isolation: isolate; }
.data-table { min-width: 600px; }
.data-table th, .data-table td { padding: var(--table-cell-y) var(--table-cell-x); }
.data-table th { position: sticky; top: 0; z-index: 1; color: var(--text-soft); font-size: var(--text-xs); letter-spacing: 0; text-transform: none; }
.data-table td { font-size: var(--text-sm); }
.density-comfortable { --table-cell-y: var(--space-3); }
.sort-button { padding: 0; background: transparent; color: inherit; cursor: pointer; font-weight: inherit; text-align: left; }
.row-action { font-size: var(--text-sm); text-decoration: underline; text-underline-offset: 3px; }
.row-action:disabled { text-decoration: none; opacity: .65; }
.filter-bar, .filter-bar-fields, .search-input { display: flex; align-items: end; flex-wrap: wrap; gap: var(--space-3); }
.filter-bar { justify-content: space-between; padding: var(--space-4); border-bottom: 1px solid var(--border); }
.search-input { flex-wrap: nowrap; gap: var(--space-2); min-width: 0; }
.table-filter { min-width: 0; width: 200px; min-height: 36px; font-size: var(--text-sm); }
.action-menu { position: relative; font-size: var(--text-sm); }
.action-menu > summary { cursor: pointer; min-height: 36px; padding: var(--space-2) var(--space-3); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface); }
.action-menu-panel { position: absolute; right: 0; z-index: 10; display: grid; gap: var(--space-2); min-width: 210px; max-width: min(320px, 85vw); max-height: 300px; overflow: auto; padding: var(--space-3); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface-raised); box-shadow: var(--shadow-sm); }
/* Row disclosures expand inside the scroll region, including its last row. */
.data-table .action-menu-panel { position: static; margin-top: var(--space-2); }
.column-choices { display: grid; gap: var(--space-2); border: 0; padding: 0; margin: 0; }
.column-choices legend { margin-bottom: var(--space-2); font-weight: 600; }
.column-choices label { display: flex; align-items: center; gap: var(--space-2); min-height: 28px; }
.skeleton { display: grid; gap: var(--space-3); padding: var(--space-4); }
.skeleton-line { display: block; height: 14px; border-radius: var(--radius-sm); background: var(--border); }
.skeleton-line:last-child { width: 65%; }
.form-section { border: 0; padding: 0; margin: 0 0 var(--space-6); min-width: 0; }
.form-section legend { font-weight: 650; margin-bottom: var(--space-2); }
.section-description { color: var(--text-soft); font-size: var(--text-sm); }
.form-grid { gap: var(--form-gap); }
.field label, .field input, .field textarea, .field select { font-size: var(--text-sm); }
.field-hint, .field-error { font-size: var(--text-xs); }
.field [readonly] { background: var(--surface-soft); }
.field [aria-invalid="true"] { border-color: var(--danger); }
.key-value-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); margin: 0; }
.key-value-grid dt { color: var(--text-soft); font-size: var(--text-xs); }
.key-value-grid dd { margin: var(--space-1) 0 0; overflow-wrap: anywhere; }
dialog.drawer { margin: 0 0 0 auto; height: 100dvh; max-height: 100dvh; width: min(520px, 100vw); max-width: 100vw; border-radius: 0; }
.lookup-search, .license-related-nav { display: flex; gap: var(--space-2); flex-wrap: wrap; }
.lookup-search input { flex: 1; min-width: 0; width: 100px; }
.lookup-results .table-footer { padding: var(--space-2) 0; }
.lookup-results .empty-state, .lookup-results .table-loading, .lookup-results .error-state { min-height: 0; padding: var(--space-3); }
.lookup-results .empty-state .state-icon { display: none; }
.lookup-results .empty-state .state-title { margin: 0; font-size: var(--text-sm); }
.lookup-results .empty-state .state-message { margin-bottom: 0; font-size: var(--text-xs); }
.license-feedback:empty, .license-operation:empty { display: none; }
.cell-nowrap { white-space: nowrap; }
.lifecycle-content { overflow-wrap: anywhere; }
.lifecycle-impact { margin: 0; font-size: var(--text-sm); }
.lifecycle-content > div:empty { display: none; }
#create-license > .panel { margin-bottom: var(--space-4); }
.drawer .modal-shell { max-height: 100dvh; }

@media (min-width: 721px) {
  .is-sidebar-collapsed { --sidebar-width: var(--sidebar-compact-width); }
  .is-sidebar-collapsed .brand { padding-inline: var(--space-4); }
  .is-sidebar-collapsed .brand-copy, .is-sidebar-collapsed .nav-label,
  .is-sidebar-collapsed .nav-group-title, .is-sidebar-collapsed .sidebar-footer { display: none; }
  .is-sidebar-collapsed .sidebar-nav { padding-inline: var(--space-2); }
  .is-sidebar-collapsed .nav-link { justify-content: center; }
  .is-sidebar-collapsed .nav-group + .nav-group { margin-top: var(--space-3); border-top: 1px solid var(--sidebar-soft); padding-top: var(--space-3); }
}
@media (max-width: 720px) {
  .has-sidebar-overlay { overflow: hidden; }
  .sidebar { width: min(300px, calc(100vw - 40px)); box-shadow: none; }
  .app-shell.is-sidebar-open .sidebar { box-shadow: var(--shadow-lg); }
  .sidebar-close { display: grid; position: absolute; top: var(--space-4); right: var(--space-3); place-items: center; width: 36px; height: 36px; background: var(--sidebar-soft); color: var(--sidebar-text); border-radius: var(--radius-sm); font-size: 24px; }
  .content { padding: var(--space-4); }
  .page-intro h2 { font-size: var(--text-xl); }
  .page-actions .button { flex: initial; }
  .topbar { align-items: flex-start; }
  .topbar-leading { min-width: 0; }
  .breadcrumbs ol { font-size: 11px; }
  .key-value-grid { grid-template-columns: 1fr; }
  .table-scroll { max-height: 60vh; }
  .table-toolbar-actions, .search-input { width: 100%; }
  .table-filter { width: 100%; }
  .table-footer { gap: var(--space-3); }
}
