:root {
  --bg: #f2f6fb;
  --bg-strong: #e8eff8;
  --surface: rgba(255, 255, 255, 0.9);
  --surface-strong: #ffffff;
  --surface-dark: #0f1d2c;
  --surface-dark-2: #132438;
  --text: #102132;
  --muted: #63788f;
  --muted-light: rgba(255,255,255,.68);
  --line: #d9e4f0;
  --line-strong: #c2d3e4;
  --primary: #0f4c81;
  --primary-2: #16659d;
  --primary-soft: #ebf4fb;
  --accent: #33a0d8;
  --success: #12825a;
  --success-soft: #ebfbf3;
  --warning: #bb7a17;
  --warning-soft: #fff4e2;
  --danger: #c24f44;
  --danger-soft: #ffefec;
  --slate: #4a5f74;
  --slate-soft: #eef4f9;
  --glow-blue: rgba(45, 117, 178, 0.15);
  --glow-deep: rgba(12, 34, 58, 0.18);
  --shadow-xs: 0 8px 18px rgba(16, 33, 50, 0.05);
  --shadow-sm: 0 16px 32px rgba(16, 33, 50, 0.08);
  --shadow-md: 0 24px 52px rgba(16, 33, 50, 0.12);
  --shadow-lg: 0 32px 72px rgba(10, 25, 42, 0.18);
  --radius-xl: 30px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 14px;
  --topbar-height: 104px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--text);
  font: 15px/1.55 Inter, "Segoe UI", Roboto, Arial, sans-serif;
  background:
    radial-gradient(circle at 5% 0%, rgba(23, 95, 150, 0.16), transparent 30%),
    radial-gradient(circle at 95% 10%, rgba(43, 147, 215, 0.16), transparent 26%),
    linear-gradient(180deg, #f8fbff 0%, var(--bg) 260px, #eef4fa 100%);
}

a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: none; }
h1, h2, h3, h4 { margin: 0 0 10px; line-height: 1.12; color: #102235; }
p { margin: 0 0 10px; }
strong { font-weight: 750; }
small { font-size: 12px; }

.app-shell {
  min-height: 100vh;
  position: relative;
  overflow-x: hidden;
  overflow-y: visible;
}

.app-backdrop {
  position: fixed;
  inset: auto;
  pointer-events: none;
  border-radius: 999px;
  filter: blur(20px);
  opacity: 0.9;
  z-index: 0;
}
.app-backdrop-a {
  top: 130px;
  right: -120px;
  width: 420px;
  height: 420px;
  background: radial-gradient(circle, rgba(47, 127, 188, 0.18) 0%, rgba(47, 127, 188, 0) 72%);
}
.app-backdrop-b {
  bottom: 20px;
  left: -140px;
  width: 480px;
  height: 480px;
  background: radial-gradient(circle, rgba(64, 174, 224, 0.14) 0%, rgba(64, 174, 224, 0) 70%);
}

.topbar-wrap {
  position: sticky;
  top: 0;
  z-index: 30;
  padding: 18px 22px 0;
}
.topbar {
  max-width: 1560px;
  margin: 0 auto;
  background: linear-gradient(180deg, rgba(14, 25, 38, 0.92), rgba(12, 22, 34, 0.88));
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 28px;
  box-shadow: var(--shadow-lg);
}
.topbar-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  min-height: var(--topbar-height);
  padding: 18px 26px;
}
.brand-group,
.topbar-panel,
.topnav,
.topbar-tools,
.brand-copy { display: flex; align-items: center; gap: 16px; }
.brand-copy { flex-direction: column; align-items: flex-start; gap: 2px; }
.brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  padding: 8px;
  border-radius: 18px;
  position: relative;
  background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(242,248,255,0.96));
  border: 1px solid rgba(105, 145, 181, 0.28);
  box-shadow: 0 12px 24px rgba(8, 31, 58, 0.18), inset 0 1px 0 rgba(255,255,255,.72);
}
.brand-mark::before {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(240,247,255,0.9), rgba(255,255,255,0.66));
}
.brand-mark-image {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.brand-mark-core {
  position: relative;
  z-index: 1;
  color: #fff;
  font-size: 18px;
  font-weight: 800;
  letter-spacing: .08em;
}
.brand,
.brand:hover { color: #fff; font-size: 21px; font-weight: 800; }
.brand-subtitle { color: rgba(255,255,255,0.78); font-size: 12px; line-height: 1.45; max-width: 780px; }

.brand-multiline {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  line-height: 1.08;
}
.brand-line {
  display: block;
}

.topmenu {
  position: relative;
}
.topmenu summary {
  list-style: none;
}
.topmenu summary::-webkit-details-marker {
  display: none;
}
.topmenu-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 96px;
  padding: 12px 16px;
  border-radius: 16px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
  transition: .18s ease;
  user-select: none;
}
.topmenu[open] .topmenu-button,
.topmenu-button:hover {
  background: rgba(255,255,255,.1);
  border-color: rgba(255,255,255,.2);
}
.topmenu-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  min-width: 260px;
  display: grid;
  gap: 8px;
  padding: 12px;
  border-radius: 20px;
  background: rgba(12, 23, 35, 0.96);
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 18px 40px rgba(4, 16, 30, 0.32);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
.topmenu-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 14px;
  color: rgba(255,255,255,.82);
  border: 1px solid transparent;
  transition: .18s ease;
}
.topmenu-link:hover,
.topmenu-link.active {
  color: #fff;
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.1);
}
.topbar-tools-inline {
  gap: 12px;
  width: 100%;
}
.topbar-tools-inline .user-chip {
  margin-left: auto;
}

.topbar-panel { flex: 1; justify-content: space-between; }
.topnav { flex-wrap: wrap; }
.topnav-link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 15px;
  border-radius: 16px;
  color: rgba(255,255,255,0.78);
  border: 1px solid transparent;
  transition: .18s ease;
}
.topnav-link:hover,
.topnav-link.active {
  color: #fff;
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.11);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.topnav-kicker {
  font-size: 11px;
  line-height: 1;
  opacity: .72;
  letter-spacing: .08em;
}
.user-chip {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 8px 12px 8px 8px;
  border-radius: 18px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
}
.user-avatar {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #2f82bf 0%, #1a507e 100%);
  color: #fff;
  font-weight: 800;
  letter-spacing: .04em;
}
.user-name { color: #fff; font-weight: 700; }
.user-role { color: rgba(255,255,255,0.68); font-size: 12px; }

.container {
  position: relative;
  z-index: 1;
  max-width: 1560px;
  margin: 0 auto;
  padding: 24px 22px 48px;
}
.page-shell { display: grid; gap: 22px; }

.message-stack { display: grid; gap: 10px; }
.message {
  padding: 15px 18px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.86);
  box-shadow: var(--shadow-xs);
}
.message.success { border-color: #bee5cf; background: #f0fbf5; }
.message.error { border-color: #f2c3be; background: #fff3f1; }
.message.warning { border-color: #f0d7ae; background: #fff9ef; }

.hero {
  position: relative;
  overflow: hidden;
  padding: 34px 36px;
  border-radius: var(--radius-xl);
  color: #fff;
  background:
    radial-gradient(circle at 95% 15%, rgba(255,255,255,.2), transparent 22%),
    radial-gradient(circle at 0% 0%, rgba(255,255,255,.14), transparent 18%),
    linear-gradient(135deg, #10283f 0%, #11456e 48%, #1d7ab3 100%);
  box-shadow: var(--shadow-lg);
}
.hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(120deg, rgba(255,255,255,.09), rgba(255,255,255,0) 40%),
    linear-gradient(transparent 24px, rgba(255,255,255,.05) 25px, transparent 26px),
    linear-gradient(90deg, transparent 24px, rgba(255,255,255,.04) 25px, transparent 26px);
  background-size: auto, 100% 26px, 26px 100%;
  opacity: .5;
  pointer-events: none;
}
.hero > * { position: relative; z-index: 1; }
.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(340px, 0.9fr);
  gap: 24px;
  align-items: stretch;
}
.hero-main { display: grid; align-content: center; gap: 14px; }
.hero h1 {
  color: #fff;
  font-size: clamp(30px, 3vw, 42px);
  letter-spacing: -.03em;
  margin-bottom: 0;
}
.hero.hero-slim h1 { font-size: clamp(28px, 2.4vw, 36px); }
.hero-text {
  max-width: 920px;
  color: rgba(255,255,255,0.88);
  font-size: 15px;
}
.hero-chip-row,
.hero-actions,
.hero-side,
.glass-card-header,
.route-item,
.phase-step,
.field-check,
.workspace-card,
.info-tile,
.metric-pile-item,
.project-card-showcase-header,
.section-card-header-rich,
.route-list,
.topbar-tools { display: flex; align-items: center; }
.hero-chip-row,
.hero-actions { flex-wrap: wrap; gap: 12px; }
.hero-side { justify-content: stretch; }
.eyebrow,
.mini-kicker,
.mini-kicker-light {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.13);
  color: rgba(255,255,255,.92);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.mini-kicker {
  background: #edf5fd;
  color: var(--primary);
}
.mini-kicker-light {
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.86);
}
.chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 36px;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
}
.chip-glass {
  background: rgba(255,255,255,.1);
  color: #fff;
  border: 1px solid rgba(255,255,255,.12);
}

.glass-card {
  width: 100%;
  border-radius: 24px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.16);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 16px 40px rgba(5, 16, 29, .18);
  padding: 20px;
}
.glass-card-large { padding: 22px; }
.glass-card h3 { color: #fff; margin: 4px 0 0; }
.hero-side-panel { display: grid; gap: 18px; align-content: start; }
.hero-side-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.hero-side-grid-compact { gap: 10px; }
.hero-side-metric {
  display: grid;
  gap: 6px;
  padding: 14px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(9, 28, 49, .18) 0%, rgba(255,255,255,.08) 100%);
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}
.hero-side-metric span {
  color: rgba(255,255,255,.96);
  font-weight: 700;
}
.hero-side-metric small {
  color: rgba(255,255,255,.88);
  font-weight: 600;
}
.hero-side-metric strong {
  font-size: 24px;
  color: #fff;
  text-shadow: 0 1px 1px rgba(0,0,0,.12);
}
.hero-actions-spaced { padding-top: 4px; }

.panel,
.card {
  position: relative;
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(249,251,253,.96) 100%);
  border: 1px solid rgba(255,255,255,.82);
  box-shadow: var(--shadow-sm);
  padding: 24px;
  overflow: hidden;
}
.panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,0));
  pointer-events: none;
}
.panel > * { position: relative; z-index: 1; }
.panel-elevated { box-shadow: var(--shadow-md); }
.panel-immersive {
  background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(245,249,253,.97) 100%);
  border-color: rgba(212, 226, 239, .82);
}
.panel-highlighted {
  background: linear-gradient(180deg, #fbfdff 0%, #f2f7fd 100%);
  border-color: #dce8f4;
}
.panel-dark-surface {
  background: linear-gradient(160deg, #12263a 0%, #0e1e30 100%);
  border-color: rgba(255,255,255,.06);
  box-shadow: 0 22px 48px rgba(8, 17, 28, .28);
}
.panel-header,
.page-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
  margin-bottom: 18px;
}
.panel-header-spacious { margin-bottom: 22px; }
.compact-header { margin-bottom: 14px; }
.panel-header-light h2,
.panel-header-light p { color: #fff; }
.muted,
.small-note,
.note { color: var(--muted); }
.muted-light { color: var(--muted-light); }
.text-link {
  font-weight: 700;
  color: var(--primary);
}
.text-link:hover { color: var(--primary-2); }

.grid { display: grid; gap: 24px; }
.layout-dashboard { grid-template-columns: minmax(0, 1.58fr) minmax(320px, 0.84fr); }
.project-layout { grid-template-columns: minmax(0, 1.58fr) minmax(320px, 0.84fr); }
.section-layout { grid-template-columns: minmax(0, 1.34fr) minmax(340px, 0.92fr); }
.section-layout-rich { align-items: start; }
.stack-column { display: flex; flex-direction: column; gap: 24px; }
.sticky-stack { position: sticky; top: calc(var(--topbar-height) + 40px); align-self: start; }

.stats-grid,
.workspace-strip,
.project-card-grid,
.section-card-grid,
.info-grid,
.showcase-grid { display: grid; gap: 18px; }
.four-up { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.five-up { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.six-up { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.three-up { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.project-card-grid,
.section-card-grid,
.wide-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.section-card-grid-rich .section-card { min-height: 100%; }
.stat-lifted .stat-card { transform: translateY(-1px); }

.stat-card {
  position: relative;
  overflow: hidden;
  min-height: 138px;
  padding: 20px 22px;
  border-radius: 22px;
  background: linear-gradient(180deg, #fff 0%, #f8fbfe 100%);
  border: 1px solid var(--line);
  box-shadow: var(--shadow-sm);
}
.stat-card::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 4px;
}
.stat-card-rich::before {
  content: "";
  position: absolute;
  right: -18px;
  top: -24px;
  width: 90px;
  height: 90px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(18, 91, 145, .08), rgba(18, 91, 145, 0));
}
.stat-label { color: var(--muted); font-size: 12px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; margin-bottom: 12px; }
.stat-value { font-size: clamp(30px, 2.4vw, 38px); font-weight: 800; line-height: 1.05; letter-spacing: -.03em; }
.stat-value.small-text { font-size: 19px; line-height: 1.3; }
.stat-note { margin-top: 10px; color: var(--muted); font-size: 13px; }
.panel-dark-surface .stat-card {
  background: linear-gradient(180deg, rgba(255,255,255,.1) 0%, rgba(255,255,255,.06) 100%);
  border-color: rgba(255,255,255,.16);
  box-shadow: 0 14px 30px rgba(6, 18, 30, 0.18);
}
.panel-dark-surface .stat-label,
.panel-dark-surface .stat-note {
  color: rgba(255,255,255,.86);
}
.panel-dark-surface .stat-value {
  color: #ffffff;
}
.accent-blue::after { background: linear-gradient(90deg, #2c82c5, #0f4c81); }
.accent-amber::after { background: linear-gradient(90deg, #db9822, #b87716); }
.accent-red::after { background: linear-gradient(90deg, #df5d50, #c24f44); }
.accent-green::after { background: linear-gradient(90deg, #24af79, #12825a); }
.accent-slate::after { background: linear-gradient(90deg, #7f95ab, #495d72); }

.workspace-card {
  align-items: flex-start;
  gap: 16px;
  padding: 22px;
  border-radius: 22px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(215, 227, 240, .95);
  box-shadow: var(--shadow-xs);
}
.workspace-card h3 { margin-bottom: 6px; font-size: 19px; }
.workspace-card p { color: var(--muted); margin-bottom: 0; }
.workspace-icon {
  min-width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--primary-soft), #dcecf8);
  color: var(--primary);
  font-weight: 800;
  letter-spacing: .05em;
}

.project-card,
.section-card,
.attachment-card,
.attention-item,
.showcase-card,
.info-tile,
.empty-state {
  position: relative;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(255,255,255,.97) 0%, rgba(248,251,254,.98) 100%);
  box-shadow: var(--shadow-xs);
}
.project-card,
.section-card,
.attachment-card,
.attention-item,
.showcase-card { padding: 18px; }

.project-card,
.section-card {
  display: grid;
  align-content: start;
  gap: 0;
}
.project-card-premium,
.section-card-premium,
.attention-item-rich,
.attachment-card-rich {
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.section-card-premium {
  padding: 22px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 62%, #f2f8fd 100%);
  border-color: #d5e3f0;
}
.project-card-premium:hover,
.section-card-premium:hover,
.attention-item-rich:hover,
.attachment-card-rich:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-sm);
  border-color: #cddded;
}
.project-card-premium { overflow: hidden; }
.project-card-glow {
  position: absolute;
  right: -28px;
  top: -30px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(39, 124, 189, 0.12) 0%, rgba(39, 124, 189, 0) 72%);
}
.project-card-top,
.section-card-header,
.attention-title-row,
.project-card-showcase-header { display: flex; justify-content: space-between; gap: 14px; align-items: flex-start; }
.project-card h3,
.section-card h3,
.attention-item h3 { font-size: 21px; margin-bottom: 0; }
.section-card h3 {
  font-size: 18px;
  line-height: 1.16;
  letter-spacing: -.02em;
  word-break: break-word;
}
.project-code,
.section-department,
.attention-project {
  margin-bottom: 6px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .07em;
  color: var(--muted);
  text-transform: uppercase;
}
.project-text {
  color: #24384c;
  min-height: 68px;
  margin-bottom: 0;
}
.project-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
}
.project-chip {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 8px 11px;
  border-radius: 999px;
  background: #f2f7fc;
  border: 1px solid #dde9f4;
  color: var(--slate);
  font-size: 12px;
  font-weight: 650;
}
.project-card-showcase .project-card-top-block { display: grid; gap: 2px; }
.meta-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  color: var(--muted);
  font-size: 13px;
}
.meta-row.tight { font-size: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
.meta-row.tight span:last-child { text-align: right; }
.progress-block { margin-top: 16px; }
.progress-block-emphasis { margin-top: 18px; }
.progress-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 9px;
  font-size: 13px;
  color: var(--muted);
}
.progress {
  width: 100%;
  height: 11px;
  border-radius: 999px;
  background: linear-gradient(180deg, #e3ecf4 0%, #dce7f1 100%);
  overflow: hidden;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.04);
}
.progress > span,
.progress-fill {
  display: block;
  width: var(--progress-width, 0%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #2f83c1 0%, #0f4c81 100%);
  box-shadow: 0 0 0 1px rgba(255,255,255,.16), inset 0 1px 0 rgba(255,255,255,.22);
}
.progress-premium {
  background: linear-gradient(180deg, #dfe9f4 0%, #d8e4ef 100%);
}
.large-progress { height: 15px; }
.compact-progress { height: 8px; margin: 12px 0 10px; }
.hero-progress-value {
  font-size: clamp(42px, 3vw, 54px);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -.05em;
  color: #fff;
}
.activity-inline {
  display: grid;
  gap: 4px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  font-size: 13px;
}
.activity-inline-rich {
  padding: 14px 16px 0 0;
  background: linear-gradient(180deg, rgba(245,250,255,.5) 0%, rgba(245,250,255,0) 100%);
}
.card-actions,
.button-row,
.action-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.button-row form,
.card-actions form,
.action-bar form { margin: 0; }
.card-actions { margin-top: 18px; }
.card-actions-wide .button { min-width: 176px; }
.card-actions-wide { justify-content: flex-start; }

.route-list {
  display: grid;
  gap: 12px;
}
.route-list-compact { gap: 10px; }
.route-item {
  align-items: flex-start;
  gap: 12px;
  padding: 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.08);
}
.route-index,
.phase-index {
  min-width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  font-weight: 800;
  letter-spacing: .05em;
  background: linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,.06));
  color: #fff;
  border: 1px solid rgba(255,255,255,.12);
}
.route-item strong,
.route-item small { color: #fff; display: block; }
.route-item small { color: rgba(255,255,255,.68); margin-top: 3px; }

.phase-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.phase-step {
  align-items: flex-start;
  gap: 14px;
  padding: 18px;
  border-radius: 22px;
  background: rgba(255,255,255,.72);
  border: 1px solid #dce7f2;
  box-shadow: var(--shadow-xs);
}
.phase-step strong { display: block; font-size: 15px; }
.phase-step small { display: block; margin-top: 4px; color: var(--muted); line-height: 1.45; }
.phase-step .phase-index {
  color: var(--primary);
  background: linear-gradient(135deg, #eef6fd, #ddebfa);
  border-color: #d3e4f4;
}
.phase-step.current {
  border-color: #a7cbeb;
  box-shadow: 0 16px 34px rgba(20, 91, 146, 0.14);
}
.phase-step.current .phase-index,
.phase-step.done .phase-index {
  background: linear-gradient(135deg, #1f7db8, #114b7d);
  border-color: transparent;
  color: #fff;
}
.phase-step.done { background: linear-gradient(180deg, #f8fbff 0%, #edf5fb 100%); }

.status-stack { display: grid; gap: 0; }
.status-stack-rich {
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(212, 226, 239, .8);
  background: rgba(255,255,255,.5);
}
.status-line {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 13px 16px;
  border-bottom: 1px solid rgba(217,228,240,.82);
}
.status-line:last-child { border-bottom: 0; }
.status-line span { color: var(--muted); }
.status-line strong { text-align: right; }

.info-grid {
  margin-top: 16px;
}
.info-tile {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 12px;
  min-height: 88px;
  padding: 14px 16px;
}
.info-tile span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.info-tile strong { display: block; margin-top: 0; font-size: 30px; line-height: 1; white-space: nowrap; justify-self: end; }
.info-tile-rich { background: linear-gradient(180deg, #ffffff 0%, #f5f9fd 100%); }
.metric-pile { display: grid; gap: 12px; }
.metric-pile-item {
  justify-content: space-between;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
}
.metric-pile-item span { color: rgba(255,255,255,.74); }
.metric-pile-item strong { color: #fff; font-size: 24px; }

.section-avatar {
  min-width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  background: linear-gradient(135deg, #eef6fd, #ddebfa);
  color: var(--primary);
  font-weight: 800;
  letter-spacing: .08em;
}
.section-title-block { flex: 1; min-width: 0; }
.section-card-header-rich { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; gap: 16px; }
.section-card-header-rich .badge { justify-self: end; }
.section-department { white-space: normal; line-height: 1.3; max-width: 100%; }
.section-card .info-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.section-card .badge { max-width: 160px; white-space: normal; text-align: center; }
.section-card-header-rich {
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(214, 227, 239, .82);
  margin-bottom: 14px;
}
.section-card-header-rich .section-avatar {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 10px 20px rgba(16,33,50,.06);
}
.section-card .progress-block {
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(180deg, #f8fbff 0%, #eff6fc 100%);
  border: 1px solid #deebf6;
}
.section-card .meta-row.tight span {
  display: block;
  padding: 10px 12px;
  border-radius: 14px;
  background: #f7fbfe;
  border: 1px solid #e1ebf4;
}
.section-card .meta-row.tight span:last-child {
  text-align: left;
}
.section-card .info-tile span {
  max-width: 100%;
  line-height: 1.3;
  word-break: break-word;
}
.section-card .info-tile strong {
  color: #102235;
}

.attachment-list,
.attention-list,
.field-checklist { display: grid; gap: 12px; }
.attachment-card,
.attention-item { padding: 16px; }
.attachment-card {
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.attachment-icon {
  width: 54px;
  height: 54px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #eff6fd, #dfeef9);
  color: var(--primary);
  font-weight: 800;
  letter-spacing: .06em;
}
.attachment-body a { font-weight: 700; }
.attention-meta { color: var(--muted); margin-bottom: 10px; }

.timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 16px;
}
.timeline li {
  position: relative;
  display: grid;
  grid-template-columns: 16px minmax(0, 1fr);
  gap: 14px;
}
.timeline-bullet {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), var(--primary));
  margin-top: 7px;
  box-shadow: 0 0 0 4px rgba(51,160,216,.14);
}
.timeline-empty {
  padding: 16px;
  border-radius: 16px;
  background: #f6fafc;
  border: 1px dashed var(--line);
  color: var(--muted);
}

.form-layout { display: grid; gap: 16px; }
.form-layout.two-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.form-layout-rich { counter-reset: fieldcount; }
.field-card {
  position: relative;
  padding: 18px;
  border-radius: 20px;
  background: linear-gradient(180deg, #ffffff 0%, #f7fbfe 100%);
  border: 1px solid #dbe7f2;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 8px 18px rgba(16, 33, 50, 0.03);
}
.form-layout-rich .field-card::before {
  counter-increment: fieldcount;
  content: counter(fieldcount, decimal-leading-zero);
  position: absolute;
  top: 14px;
  right: 16px;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  color: #92a5b8;
}
.field-card-accent {
  background: linear-gradient(180deg, #f8fbff 0%, #eef5fb 100%);
  border-color: #d1e1ef;
}
label {
  display: block;
  margin-bottom: 10px;
  font-weight: 750;
  color: #163149;
}
input,
textarea,
select {
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: 16px;
  padding: 12px 14px;
  font: inherit;
  color: var(--text);
  background: rgba(255,255,255,.96);
  outline: none;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
input:focus,
textarea:focus,
select:focus {
  border-color: #3786c5;
  box-shadow: 0 0 0 4px rgba(55, 134, 197, 0.12);
}
textarea { min-height: 130px; resize: vertical; }
.error { color: var(--danger); font-size: 13px; margin-top: 8px; }
.comment-box textarea { min-height: 110px; }

.field-checklist {
  border-radius: 18px;
  background: rgba(255,255,255,.56);
  border: 1px solid rgba(214, 226, 239, .78);
  padding: 10px;
}
.field-check {
  align-items: flex-start;
  gap: 12px;
  padding: 12px;
  border-radius: 16px;
}
.field-check + .field-check { border-top: 1px solid rgba(217,228,240,.72); }
.field-check-mark {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid #b9cad9;
  margin-top: 2px;
  position: relative;
  flex: 0 0 18px;
}
.field-check.done .field-check-mark {
  border-color: var(--success);
  background: var(--success);
}
.field-check.done .field-check-mark::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 5px;
  height: 9px;
  border: solid #fff;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
.field-check strong { display: block; font-size: 14px; }
.field-check small { display: block; color: var(--muted); margin-top: 2px; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 11px 16px;
  border-radius: 14px;
  border: 1px solid transparent;
  background: linear-gradient(135deg, #1f7eb7 0%, #0f4c81 100%);
  color: #fff;
  cursor: pointer;
  font-weight: 750;
  letter-spacing: -.01em;
  box-shadow: 0 12px 24px rgba(15, 76, 129, 0.18);
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}
.button:hover { filter: brightness(1.02); transform: translateY(-1px); }
.button.secondary { background: linear-gradient(135deg, #3c6e98 0%, #24415c 100%); }
.button.success { background: linear-gradient(135deg, #22a96f 0%, #12825a 100%); }
.button.danger { background: linear-gradient(135deg, #de6155 0%, #c24f44 100%); }
.button.warning { background: linear-gradient(135deg, #db9822 0%, #b87716 100%); }
.button.ghost {
  background: rgba(255,255,255,.92);
  color: var(--text);
  border-color: var(--line-strong);
  box-shadow: none;
}
.button.subtle {
  background: rgba(255,255,255,.06);
  color: #fff;
  border-color: rgba(255,255,255,.12);
}
.button.compact { min-height: 40px; padding: 10px 14px; border-radius: 12px; font-size: 14px; }
.button.wide { width: 100%; }
.action-bar { margin-top: 22px; }
.action-bar-emphasis {
  padding-top: 16px;
  border-top: 1px solid #dbe7f2;
}

.badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 8px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .03em;
  border: 1px solid transparent;
  white-space: nowrap;
}
.badge.secondary { background: var(--slate-soft); color: var(--slate); border-color: #d4dfeb; }
.badge.info { background: var(--primary-soft); color: var(--primary); border-color: #cae0f3; }
.badge.primary { background: #edf0ff; color: #4654d8; border-color: #cfd7ff; }
.badge.warning { background: var(--warning-soft); color: var(--warning); border-color: #f1d7ab; }
.badge.accent { background: #f0eaff; color: #7250d5; border-color: #d7cafb; }
.badge.danger { background: var(--danger-soft); color: var(--danger); border-color: #f0c0bb; }
.badge.success { background: var(--success-soft); color: var(--success); border-color: #c6ead8; }
.badge.dark { background: #e1e7ee; color: #3d5266; border-color: #cad5df; }

.empty-state {
  padding: 24px;
  text-align: center;
  background: linear-gradient(180deg, #fff 0%, #f7fbfd 100%);
}
.spacious-empty { padding: 34px 28px; }
.empty-state.compact { padding: 16px; }

.login-layout {
  min-height: calc(100vh - 210px);
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(380px, 0.72fr);
  gap: 26px;
  align-items: stretch;
}
.login-showcase {
  min-width: 0;
  padding: 38px;
  border-radius: var(--radius-xl);
  color: #fff;
  background:
    radial-gradient(circle at 90% 15%, rgba(255,255,255,.18), transparent 18%),
    linear-gradient(135deg, #10283f 0%, #11456e 48%, #1d7ab3 100%);
  box-shadow: var(--shadow-lg);
}
.login-showcase h1 { color: #fff; font-size: clamp(34px, 3vw, 46px); margin-bottom: 14px; line-height: 1.05; }
.login-showcase h1 span { display: block; }
.login-showcase p { color: rgba(255,255,255,.88); max-width: 760px; }
.showcase-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 28px;
}
.showcase-card {
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.1);
}
.showcase-card strong { display: block; color: #fff; margin-bottom: 8px; }
.showcase-card span { color: rgba(255,255,255,.82); font-size: 14px; }
.login-highlights {
  display: grid;
  gap: 12px;
  margin-top: 26px;
}
.login-highlight {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.08);
}
.login-highlight span {
  width: 48px;
  height: 48px;
  border-radius: 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.12);
  color: #fff;
  font-weight: 800;
}
.login-highlight strong { display: block; color: #fff; }
.login-highlight small { color: rgba(255,255,255,.7); display: block; margin-top: 4px; }
.login-panel {
  align-self: center;
  width: 100%;
  max-width: 560px;
  margin-left: auto;
}
.login-panel-rich {
  padding: 28px;
  background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(245,249,253,.97) 100%);
}
.login-note {
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 14px;
  background: #f6fafc;
  border: 1px solid var(--line);
  color: var(--muted);
}
.login-form { display: grid; gap: 14px; }
.login-form-rich { margin-top: 8px; }

.form-panel { max-width: 1180px; }
.narrow { max-width: 520px; margin: 0 auto; }
.center-card { display: flex; justify-content: center; padding-top: 8vh; }
.table { width: 100%; border-collapse: collapse; }
.table th,
.table td {
  text-align: left;
  padding: 14px 12px;
  border-bottom: 1px solid var(--line);
  vertical-align: top;
}
.table th { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .03em; }
.kv { display: flex; justify-content: space-between; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--line); }

@media (max-width: 1400px) {
  .six-up { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .five-up { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 1220px) {
  .guest-shell .container { padding-top: 18px; }
  .layout-dashboard,
  .project-layout,
  .section-layout,
  .login-layout,
  .hero-grid,
  .project-card-grid,
  .section-card-grid,
  .wide-cards,
  .showcase-grid,
  .phase-strip { grid-template-columns: 1fr; }
  .sticky-stack { position: static; }
}

@media (max-width: 980px) {
  .topbar-wrap { padding: 14px 14px 0; }
  .container { padding: 18px 14px 34px; }
  .topbar-inner,
  .topbar-panel,
  .topnav,
  .topbar-tools,
  .panel-header,
  .hero,
  .hero-chip-row,
  .hero-actions { flex-direction: column; align-items: flex-start; }
  .topbar-panel { width: 100%; }
  .user-chip { width: 100%; }
  .four-up,
  .three-up,
  .form-layout.two-columns,
  .hero-side-grid,
  .workspace-strip { grid-template-columns: 1fr; }
  .hero { padding: 26px; }
  .section-card-header-rich { grid-template-columns: 52px minmax(0, 1fr); }
  .section-card-header-rich .badge { grid-column: 1 / -1; justify-self: start; }
  .section-card .info-grid,
  .meta-row.tight { grid-template-columns: 1fr; }

}

@media (max-width: 640px) {
  .brand-subtitle { display: none; }
  .hero h1 { font-size: 28px; }
  .project-card h3,
  .section-card h3,
  .attention-item h3 { font-size: 18px; }
  .stat-value { font-size: 30px; }
  .button,
  .button.compact { width: 100%; }
  .card-actions,
  .button-row,
  .action-bar { flex-direction: column; align-items: stretch; }
  .section-card-premium { padding: 18px; }
  .section-card .info-tile { grid-template-columns: 1fr; min-height: auto; }
  .section-card .info-tile strong { justify-self: start; }

}


.readonly-banner {
  display: inline-flex;
  margin-top: 14px;
  padding: 10px 14px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  color: rgba(255,255,255,.92);
  font-size: 13px;
  font-weight: 600;
}

.is-readonly,
.is-readonly:disabled,
textarea.is-readonly,
input.is-readonly {
  opacity: 1;
  cursor: default;
  background: rgba(148, 163, 184, 0.10) !important;
  color: var(--text) !important;
  border-color: rgba(148, 163, 184, 0.22) !important;
}



.guest-shell .topbar-wrap {
  padding: 22px 22px 0;
}
.guest-shell .container {
  max-width: 1480px;
  padding-top: 28px;
}
.layout-single {
  grid-template-columns: minmax(0, 1fr);
}
.layout-single .content-shell {
  width: 100%;
}
.layout-with-sidebar > .content-shell:only-child {
  grid-column: 1 / -1;
}

.layout-with-sidebar {
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}
.content-shell {
  min-width: 0;
  display: grid;
  gap: 22px;
}
.side-rail {
  position: sticky;
  top: calc(var(--topbar-height) + 40px);
  display: grid;
  gap: 16px;
}
.side-card {
  padding: 18px;
  border-radius: 24px;
  background: linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(247,251,254,.9) 100%);
  border: 1px solid rgba(214,227,239,.88);
  box-shadow: var(--shadow-sm);
}
.side-card-kicker {
  margin-bottom: 12px;
  color: var(--primary);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .08em;
  font-weight: 800;
}
.side-nav { display: grid; gap: 8px; }
.side-nav-link {
  display: grid;
  grid-template-columns: 38px minmax(0,1fr);
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 16px;
  color: var(--text);
  border: 1px solid transparent;
  background: rgba(255,255,255,.44);
  transition: .18s ease;
}
.side-nav-link:hover,
.side-nav-link.active {
  transform: translateY(-1px);
  border-color: #cadced;
  background: linear-gradient(180deg, #ffffff 0%, #eef5fb 100%);
  box-shadow: 0 12px 22px rgba(16,33,50,.08);
}
.side-nav-index {
  width: 38px; height: 38px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #eef6fd, #ddebfa);
  color: var(--primary); font-size: 11px; font-weight: 800; letter-spacing: .08em;
}
.side-info-card h3 { margin-bottom: 12px; }
.side-info-list { display: grid; gap: 12px; }
.side-info-list div { padding: 12px 14px; border-radius: 16px; background: #f7fbfe; border: 1px solid #e1ebf4; }
.side-info-list span { display: block; color: var(--muted); font-size: 12px; margin-bottom: 4px; }
.side-info-list strong { display: block; font-size: 14px; }
.topbar-panel-compact { flex: 0 0 auto; }
.hero-ghost { background: rgba(255,255,255,.14); border-color: rgba(255,255,255,.16); color: #fff; }

.filter-panel { padding: 22px; }
.filter-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1.2fr) repeat(2, minmax(180px, .85fr)) minmax(180px, .7fr) auto;
  gap: 14px;
  align-items: end;
}
.compact-field { padding: 14px; }
.compact-field label { margin-bottom: 8px; }
.compact-field-checkbox { display: flex; align-items: center; }
.compact-field-checkbox label { margin: 0; display: flex; align-items: center; gap: 10px; font-weight: 650; }
.compact-field-checkbox input { width: 18px; height: 18px; margin: 0; }
.filter-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.project-meta-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}
.project-meta-strip div {
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff 0%, #f5f9fd 100%);
  border: 1px solid #deebf6;
}
.project-meta-strip span { display: block; color: var(--muted); font-size: 12px; margin-bottom: 8px; }
.project-meta-strip strong { display: block; font-size: 15px; word-break: break-word; }

.section-card .info-grid { align-items: stretch; }
.section-card .info-tile {
  grid-template-columns: 1fr;
  align-items: start;
  gap: 8px;
  min-height: 104px;
  padding: 14px;
}
.section-card .info-tile span {
  max-width: 100%;
  line-height: 1.28;
  word-break: normal;
  overflow-wrap: anywhere;
  text-transform: none;
  letter-spacing: 0;
  font-size: 13px;
  font-weight: 650;
}
.section-card .info-tile strong {
  color: #102235;
  justify-self: start;
  font-size: 22px;
  line-height: 1.08;
  white-space: nowrap;
  margin-top: auto;
}
.section-card .meta-row.tight {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.task-card-grid { display: grid; gap: 16px; }
.task-card {
  padding: 20px;
  border-radius: 24px;
  background: linear-gradient(180deg, #ffffff 0%, #f6fafd 100%);
  border: 1px solid #dbe7f2;
  box-shadow: var(--shadow-xs);
}
.task-card-top { display: flex; justify-content: space-between; gap: 16px; align-items: flex-start; }
.task-card-top h3 { margin-bottom: 6px; }
.task-project-code { color: var(--primary); font-weight: 800; letter-spacing: .06em; font-size: 12px; text-transform: uppercase; margin-bottom: 4px; }
.task-card-meta { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; color: var(--muted); margin: 12px 0 0; font-size: 13px; }
.task-mini-stats { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin-top: 16px; }
.task-mini-stats div { padding: 14px 16px; border-radius: 18px; border: 1px solid #deebf6; background: #fff; }
.task-mini-stats span { display: block; color: var(--muted); font-size: 12px; margin-bottom: 8px; }
.task-mini-stats strong { font-size: 20px; line-height: 1.1; }
.review-stack { display: grid; gap: 10px; }
.review-item {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
  color: #fff;
}
.review-item strong, .review-item small { display: block; color: #fff; }
.review-item small { margin-top: 4px; color: rgba(255,255,255,.72); }

@media (max-width: 1400px) {
  .filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .layout-with-sidebar { grid-template-columns: 250px minmax(0, 1fr); }
}

@media (max-width: 1220px) {
  .layout-with-sidebar,
  .filter-grid { grid-template-columns: 1fr; }
  .side-rail { position: static; }
}

@media (max-width: 980px) {
  .layout-with-sidebar { grid-template-columns: 1fr; }
  .side-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .project-meta-strip,
  .task-mini-stats { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .side-nav { grid-template-columns: 1fr; }
  .section-card .meta-row.tight { grid-template-columns: 1fr; }
  .section-card .info-tile { min-height: auto; }
  .section-card .info-tile strong { font-size: 20px; }
  .task-card-top, .review-item { flex-direction: column; }
}


/* Top navigation layout update */
.topbar-inner {
  align-items: center;
}
.topbar-panel {
  flex: 1 1 auto;
  min-width: 0;
  gap: 18px;
}
.topnav {
  flex: 1 1 auto;
  min-width: 0;
  gap: 10px;
}
.topnav-link {
  white-space: nowrap;
}
.topbar-tools {
  flex: 0 0 auto;
  justify-content: flex-end;
}
.container {
  padding-top: 24px;
}
.content-shell {
  width: 100%;
}
.layout-with-sidebar {
  display: block;
}
.side-rail,
.side-card,
.side-nav,
.side-info-card {
  display: none !important;
}

@media (max-width: 1320px) {
  .topbar-inner {
    flex-wrap: wrap;
    align-items: stretch;
  }
  .topbar-panel {
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 4px;
  }
}

@media (max-width: 980px) {
  .topbar-wrap {
    padding: 12px 14px 0;
  }
  .topbar-inner {
    min-height: auto;
    padding: 16px;
  }
  .brand-group {
    width: 100%;
  }
  .topbar-panel {
    gap: 14px;
  }
  .topnav {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .topnav-link {
    min-width: 0;
    justify-content: flex-start;
  }
  .topbar-tools {
    width: 100%;
    justify-content: space-between;
  }
  .user-chip {
    flex: 1 1 auto;
    min-width: 0;
  }
}

@media (max-width: 640px) {
  .brand-subtitle {
    display: none;
  }
  .topnav {
    grid-template-columns: 1fr;
  }
  .topbar-tools {
    flex-direction: column;
    align-items: stretch;
  }
  .topbar-tools form,
  .topbar-tools .button {
    width: 100%;
  }
}

/* ---- Расширение проекта: паспорт, варианты, риски, экспорт ---- */
.project-layout-wide {
  grid-template-columns: minmax(0, 1.6fr) minmax(320px, 0.8fr);
}

.passport-grid {
  margin-top: 10px;
}

.passport-grid .info-tile {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  min-height: 124px;
  padding: 16px 16px 14px;
  gap: 10px;
}

.passport-grid .info-tile span {
  color: #62778f;
  font-weight: 800;
  line-height: 1.35;
  font-size: 11px;
  letter-spacing: .035em;
}

.passport-grid .info-tile strong {
  width: 100%;
  margin-top: auto;
  font-size: clamp(14px, 0.55vw + 0.55rem, 18px);
  line-height: 1.22;
  font-weight: 800;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
  hyphens: none;
  justify-self: auto;
}

.info-tile-tall {
  min-height: 116px;
}

.info-tile-tall strong {
  font-size: 18px;
  line-height: 1.35;
}

.section-meta-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(120px, 0.75fr) minmax(180px, 1fr);
  gap: 10px;
  color: var(--muted);
  font-size: 14px;
  margin-bottom: 14px;
}

.section-meta-grid > span {
  display: block;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255,255,255,.62);
  border: 1px solid #dbe7f2;
  min-width: 0;
}

.section-stats-grid {
  grid-template-columns: repeat(3, minmax(120px, 1fr));
}

.section-stats-grid .metric-tile {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 128px;
}

.section-stats-grid .metric-tile span {
  display: block;
  min-height: 34px;
  font-size: 13px;
  line-height: 1.2;
}

.section-stats-grid .metric-tile strong {
  font-size: 22px;
  line-height: 1;
}

.assignment-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  align-items: stretch;
  margin: 14px 0 6px;
}

.assignment-form-grid .assignment-submit {
  grid-column: 1 / -1;
  justify-content: flex-start;
}

.compact-field {
  padding: 14px 16px;
  min-width: 0;
}

.form-section-title {
  font-size: 13px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 6px 0 14px;
}

.span-2 {
  grid-column: span 2;
}

.two-col-equal {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.project-module-stack {
  display: grid;
  grid-template-columns: 1fr;
  gap: 24px;
}

.stack-gap-lg {
  gap: 24px;
}

.list-card {
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(130, 155, 187, 0.18);
  border-radius: 20px;
  padding: 18px 18px 16px;
  box-shadow: 0 14px 32px rgba(18, 40, 66, 0.07);
}

.list-card + .list-card {
  margin-top: 12px;
}

.list-card-top {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 8px;
}

.embedded-form {
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px solid rgba(130, 155, 187, 0.16);
}

.export-actions {
  display: flex;
  flex-wrap: wrap;
}

.route-list-light .route-item small,
.route-list-light .route-item strong {
  color: rgba(255,255,255,0.92);
}

.route-list-light .route-index {
  background: rgba(255,255,255,0.14);
  color: #fff;
}

.hero-side-metric small {
  color: rgba(255,255,255,.88);
  font-weight: 600;
}

@media (max-width: 1280px) {
  .project-layout-wide {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 980px) {
  .two-col-equal,
  .section-meta-grid,
  .assignment-form-grid {
    grid-template-columns: 1fr;
  }

  .span-2 {
    grid-column: auto;
  }
}


.ai-workspace-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.95fr);
  gap: 24px;
}

.package-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.package-card {
  min-height: 100%;
}

.prompt-block {
  border-radius: 20px;
  border: 1px solid #dbe7f2;
  background: linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(245,249,253,.96) 100%);
  padding: 18px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72), 0 8px 18px rgba(16, 33, 50, 0.03);
}

.prompt-block + .prompt-block {
  margin-top: 16px;
}

.prompt-block pre {
  margin: 12px 0 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 13px;
  line-height: 1.55;
  color: #18324a;
}

.download-tile {
  padding: 18px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
}

.download-tile strong,
.download-tile span,
.download-tile small {
  color: rgba(255,255,255,.96);
}

.download-tile small {
  display: block;
  margin-top: 6px;
  opacity: .88;
}

.export-option-list {
  display: grid;
  gap: 14px;
}

.export-option {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid #dbe7f2;
  background: rgba(255,255,255,.64);
}

.export-option .button {
  white-space: nowrap;
}

@media (max-width: 1280px) {
  .ai-workspace-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 980px) {
  .package-card-grid {
    grid-template-columns: 1fr;
  }

  .section-stats-grid {
    grid-template-columns: 1fr;
  }
}

/* ---- Вкладки карточки проекта и исправление рабочего пространства ---- */
.project-tab {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid rgba(194, 211, 228, 0.95);
  background: linear-gradient(180deg, rgba(255,255,255,0.94), rgba(245,250,255,0.86));
  box-shadow: var(--shadow-xs);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.project-tab:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-sm);
  border-color: #aac7df;
}
.project-tab.active {
  background: linear-gradient(135deg, #10345a 0%, #155788 100%);
  border-color: rgba(21,87,136,0.95);
  box-shadow: 0 20px 40px rgba(14, 56, 92, 0.22);
}
.project-tab-title {
  font-size: 16px;
  font-weight: 800;
  color: #11263b;
}
.project-tab-note {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.35;
}
.project-tab.active .project-tab-title,
.project-tab.active .project-tab-note {
  color: #fff;
}

.project-overview-layout,
.approvals-layout,
.project-export-layout {
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.95fr);
  gap: 24px;
}

.overview-cards-grid {
  margin-bottom: 18px;
}

.route-list-embedded {
  margin-top: 12px;
}

.section-card-grid-rich {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.section-card-premium {
  overflow: hidden;
}

.section-meta-grid-clean {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.section-meta-grid-clean > span {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.section-meta-grid-clean > span strong {
  font-size: 12px;
  line-height: 1.2;
  color: #607a93;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.section-meta-grid-clean > span em {
  font-style: normal;
  color: #20374c;
  font-weight: 600;
  line-height: 1.35;
}

.section-stats-grid-clean {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.metric-tile-compact {
  min-height: 110px;
  padding: 18px 18px 16px;
}

.metric-tile-compact span {
  min-height: auto;
  font-size: 12px;
  line-height: 1.2;
  letter-spacing: .02em;
}

.metric-tile-compact strong {
  font-size: 18px;
  line-height: 1.05;
  word-break: keep-all;
}

.assignment-form-grid-clean {
  grid-template-columns: minmax(0, 1.15fr) minmax(160px, 0.9fr) auto;
  align-items: end;
}

.assignment-form-grid-clean .compact-field-clean {
  min-width: 0;
}

.assignment-form-grid-clean .compact-field-clean select,
.assignment-form-grid-clean .compact-field-clean input {
  min-width: 0;
  width: 100%;
}

.assignment-form-grid-clean .assignment-submit {
  grid-column: auto;
  align-self: end;
  justify-content: flex-end;
  padding-bottom: 4px;
}

.stack-list-wide {
  display: grid;
  gap: 14px;
}

.list-card-wide {
  padding: 22px 24px;
}

.form-layout-wide {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.attachment-list-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.export-actions-large {
  margin-top: 18px;
}

@media (max-width: 1380px) {
  .project-tabs {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .section-card-grid-rich {
    grid-template-columns: 1fr;
  }

  .project-overview-layout,
  .approvals-layout,
  .project-export-layout {
    grid-template-columns: 1fr;
  }

  .assignment-form-grid-clean {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .assignment-form-grid-clean .assignment-submit {
    grid-column: 1 / -1;
    justify-content: flex-start;
    padding-bottom: 0;
  }
}

@media (max-width: 980px) {
  .project-tabs,
  .section-meta-grid-clean,
  .section-stats-grid-clean,
  .attachment-list-grid,
  .form-layout-wide,
  .assignment-form-grid-clean {
    grid-template-columns: 1fr;
  }
}

/* --- UX upgrade: project workspace, media and AI export --- */
.project-hero-media .hero-side {
  align-items: stretch;
}
.project-preview-card {
  gap: 16px;
  align-content: start;
}
.project-reference-hero,
.reference-preview-card {
  border-radius: 22px;
  overflow: hidden;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}
.project-reference-hero img,
.reference-preview-card img {
  width: 100%;
  display: block;
  aspect-ratio: 16/10;
  object-fit: cover;
}
.project-reference-caption,
.reference-preview-caption {
  font-size: 13px;
  padding-top: 10px;
}
.project-reference-caption {
  color: rgba(255,255,255,.88);
  font-weight: 600;
}
.reference-preview-caption {
  color: #4f657b;
  font-weight: 600;
}
.project-reference-empty {
  display: grid;
  gap: 8px;
  padding: 18px;
  border-radius: 20px;
  border: 1px dashed rgba(255,255,255,.18);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.86);
}
.project-overview-layout-wide {
  grid-template-columns: minmax(0, 1.6fr) minmax(320px, 0.9fr);
}
.reference-preview-card {
  padding: 14px;
  background: rgba(255,255,255,.96);
  border: 1px solid var(--line);
}
.reference-preview-card img {
  border-radius: 16px;
}
.reference-preview-caption {
  padding: 10px 2px 2px;
}
.form-layout-overview {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.section-card-balanced {
  display: grid;
  gap: 16px;
}
.section-meta-grid-balanced {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}
.section-meta-grid-balanced > span {
  min-width: 0;
  padding: 14px 16px;
  border-radius: 18px;
  background: rgba(243,247,252,.96);
  border: 1px solid var(--line);
}
.section-meta-grid-balanced > span em {
  word-break: break-word;
}
.section-stat-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(120px, 1fr));
  gap: 12px;
}
.metric-chip {
  display: grid;
  gap: 8px;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.86);
  min-width: 0;
}
.metric-chip span {
  font-size: 13px;
  color: var(--muted);
  font-weight: 700;
  line-height: 1.2;
}
.metric-chip strong {
  font-size: 16px;
  line-height: 1.1;
  color: var(--text);
}
.assignment-form-stacked {
  display: grid;
  gap: 12px;
}
.assignment-fields-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(180px, 0.85fr);
  gap: 12px;
}
.assignment-fields-grid .field-card {
  margin: 0;
}
.assignment-submit-row {
  justify-content: flex-start;
}
.variant-gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.variant-card {
  display: grid;
  grid-template-columns: minmax(220px, 0.95fr) minmax(0, 1.2fr);
  gap: 18px;
  padding: 18px;
  border-radius: 24px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.92);
  box-shadow: var(--shadow-xs);
}
.variant-card-media {
  border-radius: 18px;
  overflow: hidden;
  background: var(--bg-strong);
  border: 1px solid var(--line);
  min-height: 210px;
}
.variant-card-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.variant-card-media-empty {
  height: 100%;
  min-height: 210px;
  display: grid;
  place-items: center;
  text-align: center;
  color: var(--muted);
  padding: 18px;
}
.variant-card-body {
  display: grid;
  gap: 12px;
  align-content: start;
}
.card-actions-tight {
  gap: 10px;
  flex-wrap: wrap;
}
.form-layout-risk-wide {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.risk-card-grid {
  display: grid;
  gap: 14px;
}
.risk-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.chip-soft {
  background: var(--primary-soft);
  color: var(--primary);
  border: 1px solid #d8e7f5;
}
.ai-workspace-grid-fixed {
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.8fr);
  align-items: start;
}
.package-card-grid-wide {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.route-list-vertical {
  display: grid;
  gap: 12px;
}
.danger-outline {
  background: #fff;
  color: var(--danger);
  border: 1px solid #efc1bc;
}
.danger-outline:hover {
  background: var(--danger-soft);
}
.embedded-form-wide .field-card input[type="file"] {
  padding: 12px;
  background: #fff;
}
@media (max-width: 1380px) {
  .project-overview-layout-wide,
  .ai-workspace-grid-fixed,
  .variant-gallery-grid {
    grid-template-columns: 1fr;
  }
  .variant-card {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 980px) {
  .section-meta-grid-balanced,
  .section-stat-row,
  .assignment-fields-grid,
  .form-layout-overview,
  .form-layout-risk-wide,
  .package-card-grid-wide {
    grid-template-columns: 1fr;
  }
  .metric-chip strong {
    font-size: 15px;
  }
}


/* --- AI workspace visual fixes --- */
.package-card-grid-wide {
  align-items: stretch;
}
.package-card {
  display: grid;
  grid-template-columns: 1fr;
  align-items: start;
  gap: 10px;
  min-height: 132px;
  padding: 18px 20px;
}
.package-card .package-card-name {
  display: block;
  color: #7a94ad;
  font-size: 11px;
  line-height: 1.2;
  letter-spacing: .08em;
  text-transform: uppercase;
  word-break: break-word;
}
.package-card .package-card-description {
  display: block;
  justify-self: start;
  margin-top: 0;
  color: #18324a;
  font-size: 18px;
  line-height: 1.35;
  white-space: normal;
  word-break: break-word;
  text-wrap: pretty;
}
.ai-workspace-grid-fixed .route-list-vertical .route-item {
  background: linear-gradient(180deg, #ffffff 0%, #f6f9fc 100%);
  border: 1px solid #dbe7f2;
}
.ai-workspace-grid-fixed .route-list-vertical .route-index {
  background: linear-gradient(135deg, #eef5fb 0%, #dfeaf6 100%);
  color: var(--primary);
  border-color: #d3e2f0;
}
.ai-workspace-grid-fixed .route-list-vertical .route-item strong {
  color: #18324a;
}
.ai-workspace-grid-fixed .route-list-vertical .route-item small {
  color: var(--muted);
}
.ai-workspace-grid-fixed .panel .route-list-vertical {
  gap: 12px;
}
.ai-workspace-grid-fixed .panel .route-item > div {
  min-width: 0;
}
.ai-workspace-grid-fixed .panel .route-item strong,
.ai-workspace-grid-fixed .panel .route-item small {
  word-break: break-word;
}
@media (max-width: 1280px) {
  .package-card {
    min-height: 116px;
  }
}
@media (max-width: 980px) {
  .package-card-grid-wide {
    grid-template-columns: 1fr;
  }
  .package-card .package-card-description {
    font-size: 16px;
  }
}

/* --- final polish: sections, approvals, variants --- */
.section-card-balanced {
  align-content: start;
}
.section-meta-grid-balanced {
  grid-template-columns: repeat(3, minmax(140px, 1fr));
}
.section-meta-grid-balanced > span {
  min-height: 76px;
}
.section-meta-grid-balanced > span strong {
  display: block;
  margin-bottom: 6px;
}
.section-stat-row {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.metric-chip {
  min-height: 88px;
}
.metric-chip strong {
  font-size: 14px;
}
.assignment-form-inline {
  margin-top: 2px;
}
.assignment-fields-grid-inline {
  grid-template-columns: minmax(0, 1.2fr) minmax(180px, 0.9fr) auto;
  align-items: end;
}
.assignment-fields-grid-inline .field-card {
  margin: 0;
}
.assignment-submit-slot {
  display: flex;
  align-items: end;
  justify-content: flex-start;
  padding-bottom: 4px;
}
.approvals-layout-balanced {
  align-items: start;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.9fr);
}
.approvals-main,
.approvals-aside > .panel {
  min-height: 100%;
}
.approvals-attachments {
  display: grid;
  gap: 12px;
}
.attachment-card-compact {
  padding: 14px;
  grid-template-columns: 44px minmax(0, 1fr);
  gap: 12px;
}
.attachment-card-compact .attachment-icon {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  font-size: 12px;
}
.variant-editor-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(320px, 0.85fr);
  gap: 20px;
  align-items: start;
}
.variant-editor-main,
.variant-editor-side {
  display: grid;
  gap: 16px;
}
.variant-editor-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.variant-editor-preview {
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.92);
}
.variant-editor-preview img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
.variant-editor-preview-caption {
  padding: 10px 14px 14px;
  font-size: 13px;
  color: var(--muted);
}
.toggle-card .toggle-row {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}
.toggle-card input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  accent-color: var(--primary);
}
.variant-gallery-grid {
  grid-template-columns: 1fr;
}
.variant-card {
  grid-template-columns: minmax(240px, 0.9fr) minmax(0, 1.2fr);
}
@media (max-width: 1380px) {
  .approvals-layout-balanced,
  .variant-editor-layout,
  .variant-card {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 1080px) {
  .assignment-fields-grid-inline,
  .variant-editor-split {
    grid-template-columns: 1fr;
  }
  .assignment-submit-slot {
    padding-bottom: 0;
  }
}
@media (max-width: 900px) {
  .section-meta-grid-balanced,
  .section-stat-row {
    grid-template-columns: 1fr;
  }
}

/* ===== Functional upgrade: project action strip, export wizard, registries ===== */
.project-action-strip-wrap {
  position: sticky;
  top: calc(var(--topbar-height) - 8px);
  z-index: 9;
  margin-top: 10px;
}
.project-action-strip {
  width: min(1400px, calc(100vw - 48px));
  margin: 0 auto;
  display: flex;
  gap: 18px;
  align-items: center;
  justify-content: space-between;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(194, 211, 228, .9);
  border-radius: 20px;
  box-shadow: var(--shadow-xs);
  backdrop-filter: blur(14px);
  padding: 10px 16px;
}
.project-action-strip-main { display: flex; align-items: center; gap: 14px; min-width: 0; }
.project-action-strip-code {
  padding: 8px 12px;
  border-radius: 12px;
  background: var(--primary-soft);
  color: var(--primary);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  white-space: nowrap;
}
.project-action-strip-title {
  font-weight: 750;
  color: var(--text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 360px;
}
.project-action-nav { display: flex; flex-wrap: wrap; gap: 10px; justify-content: flex-end; }
.project-action-link {
  display: inline-flex;
  align-items: center;
  padding: 10px 14px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.9);
  color: var(--muted);
  font-weight: 700;
}
.project-action-link.active,
.project-action-link:hover { background: linear-gradient(135deg, var(--primary), var(--primary-2)); color: #fff; border-color: transparent; }

.filters-row {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  align-items: end;
}
.filters-row-tight { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.filters-row-wide { grid-template-columns: 2fr 1fr 1fr 1fr auto; }
.filters-row input,
.filters-row select {
  width: 100%;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--line-strong);
  background: rgba(255,255,255,.95);
  color: var(--text);
  min-height: 48px;
}
.checkbox-inline {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 0 8px;
  color: var(--text);
  font-weight: 600;
}
.checkbox-inline input[type="checkbox"] { accent-color: var(--primary); width: 16px; height: 16px; }

.panel-header-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.compact-timeline li { padding-bottom: 12px; }
.compact-timeline .timeline-bullet { width: 10px; height: 10px; }

.export-wizard-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, .8fr);
  gap: 22px;
  align-items: start;
}
.export-switcher-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.wizard-stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.risk-matrix-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.risk-matrix-cell {
  border-radius: 22px;
  padding: 22px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.92);
  box-shadow: var(--shadow-xs);
}
.risk-matrix-cell.critical { background: linear-gradient(180deg, rgba(255,239,236,.96), rgba(255,255,255,.96)); border-color: rgba(194,79,68,.2); }
.risk-matrix-cell.medium { background: linear-gradient(180deg, rgba(255,244,226,.96), rgba(255,255,255,.96)); border-color: rgba(187,122,23,.18); }
.risk-matrix-cell.low { background: linear-gradient(180deg, rgba(235,251,243,.96), rgba(255,255,255,.96)); border-color: rgba(18,130,90,.18); }
.risk-matrix-title { font-size: 13px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.risk-matrix-value { font-size: 38px; line-height: 1; font-weight: 800; margin: 10px 0; }
.risk-matrix-note { color: var(--muted); }
.risk-priority-critical { border-color: rgba(194,79,68,.28) !important; box-shadow: 0 18px 36px rgba(194,79,68,.08); }
.risk-priority-medium { border-color: rgba(187,122,23,.24) !important; box-shadow: 0 18px 36px rgba(187,122,23,.08); }
.risk-priority-low { border-color: rgba(18,130,90,.22) !important; box-shadow: 0 18px 36px rgba(18,130,90,.08); }

.attachment-list-spacious { display: grid; gap: 16px; }
.attachment-card-wide { display: grid; grid-template-columns: 90px minmax(0,1fr); gap: 14px; align-items: start; }
.attachment-card-wide .attachment-icon { width: 90px; height: 72px; border-radius: 18px; }

.switcher-row { display: grid; gap: 12px; }

@media (max-width: 1280px) {
  .project-action-strip { width: calc(100vw - 32px); flex-direction: column; align-items: stretch; }
  .project-action-strip-title { max-width: none; white-space: normal; }
  .export-wizard-layout,
  .approvals-layout-balanced { grid-template-columns: 1fr; }
}

@media (max-width: 1080px) {
  .project-action-strip-wrap { position: static; }
  .export-switcher-row,
  .filters-row,
  .filters-row-tight,
  .filters-row-wide,
  .risk-matrix-grid,
  .wizard-stats-grid { grid-template-columns: 1fr; }
  .project-action-nav { justify-content: flex-start; }
}

/* Export wizard surface fixes */
.export-wizard-surface .route-item,
.route-list-surface .route-item {
  background: linear-gradient(180deg, #ffffff 0%, #f7fafc 100%);
  border: 1px solid #dbe7f2;
}
.export-wizard-surface .route-index,
.route-list-surface .route-index {
  background: linear-gradient(135deg, #eef5fb 0%, #dfeaf6 100%);
  color: var(--primary);
  border-color: #d3e2f0;
}
.export-wizard-surface .route-item strong,
.export-wizard-surface .route-item small,
.route-list-surface .route-item strong,
.route-list-surface .route-item small {
  color: #18324a;
}
.export-wizard-surface .route-item small,
.route-list-surface .route-item small {
  color: var(--muted);
}
.wizard-stats-grid .stat-card {
  background: rgba(255,255,255,.92);
  border-color: rgba(255,255,255,.18);
}
.wizard-stats-grid .stat-label,
.wizard-stats-grid .stat-note {
  color: #57718d;
}
.wizard-stats-grid .stat-value {
  color: #17324a;
}

/* Section prompt templates */
.prompt-bank {
  margin-top: 14px;
  border: 1px solid #d9e6f2;
  border-radius: 20px;
  background: linear-gradient(180deg, #fbfdff 0%, #f4f8fc 100%);
  overflow: hidden;
}
.prompt-bank summary {
  cursor: pointer;
  list-style: none;
  padding: 14px 18px;
  font-weight: 800;
  color: #18324a;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.prompt-bank summary::-webkit-details-marker { display: none; }
.prompt-bank summary::after {
  content: '+';
  font-size: 22px;
  line-height: 1;
  color: var(--primary);
}
.prompt-bank[open] summary::after { content: '−'; }
.prompt-bank-body {
  display: grid;
  gap: 12px;
  padding: 0 18px 18px;
}
.prompt-bank-body-inline {
  padding: 0;
}
.prompt-card {
  border: 1px solid #dbe7f2;
  border-radius: 18px;
  padding: 14px;
  background: rgba(255,255,255,.88);
  box-shadow: var(--shadow-xs);
}
.prompt-card h4 {
  margin: 0 0 10px;
  font-size: 15px;
  line-height: 1.35;
  color: #18324a;
}
.prompt-textarea {
  width: 100%;
  min-height: 148px;
  resize: vertical;
  border-radius: 14px;
  border: 1px solid #cfdeeb;
  background: #f8fbfe;
  color: #1e3650;
  padding: 12px 14px;
  font: 500 13px/1.5 Inter, system-ui, sans-serif;
}
.prompt-textarea:focus {
  outline: none;
  border-color: #9bbfe2;
  box-shadow: 0 0 0 4px rgba(38, 106, 167, 0.08);
}
.section-card .prompt-textarea {
  min-height: 132px;
}
@media (max-width: 1080px) {
  .section-card .prompt-textarea,
  .prompt-textarea {
    min-height: 120px;
  }
}

/* Direct prompt variants on section cards */
.prompt-inline-shell {
  margin-top: 14px;
  border: 1px solid #d9e6f2;
  border-radius: 20px;
  background: linear-gradient(180deg, #fbfdff 0%, #f4f8fc 100%);
  padding: 14px;
}
.prompt-disclosure {
  padding: 0;
  overflow: hidden;
}
.prompt-disclosure-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 14px 16px;
  cursor: pointer;
  list-style: none;
}
.prompt-disclosure-summary::-webkit-details-marker {
  display: none;
}
.prompt-disclosure-summary strong {
  display: block;
  color: #18324a;
  font-size: 15px;
  line-height: 1.35;
}
.prompt-disclosure-icon {
  width: 12px;
  height: 12px;
  border-right: 2px solid #587694;
  border-bottom: 2px solid #587694;
  transform: rotate(45deg);
  transition: transform .18s ease;
  margin-right: 4px;
}
.prompt-disclosure[open] .prompt-disclosure-icon {
  transform: rotate(-135deg);
}
.prompt-disclosure .prompt-switcher,
.prompt-disclosure .empty-state {
  padding: 0 16px 16px;
}
.prompt-inline-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.prompt-inline-head strong {
  display: block;
  color: #18324a;
  font-size: 15px;
  line-height: 1.35;
}
.prompt-switcher {
  display: grid;
  gap: 12px;
}
.prompt-tab-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.prompt-tab {
  appearance: none;
  border: 1px solid #c7d9ea;
  background: #f8fbfe;
  color: #33506e;
  border-radius: 999px;
  padding: 8px 12px;
  font: 700 12px/1.2 Inter, system-ui, sans-serif;
  cursor: pointer;
  transition: .2s ease;
}
.prompt-tab:hover {
  border-color: #9bbfe2;
  color: #17324a;
}
.prompt-tab.active {
  background: linear-gradient(135deg, #1e5f98 0%, #2f85c8 100%);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 10px 22px rgba(24, 84, 136, 0.18);
}
.prompt-panel-stack {
  display: grid;
}
.prompt-panel {
  display: none;
}
.prompt-panel.active {
  display: block;
}
.prompt-panel-caption {
  margin-bottom: 8px;
  color: #5f7994;
  font-size: 13px;
  line-height: 1.45;
}
.section-card .prompt-textarea {
  min-height: 148px;
}
@media (max-width: 1080px) {
  .prompt-tab-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  .prompt-tab-row {
    grid-template-columns: 1fr;
  }
}


@media (max-width: 980px) {
  .topmenu {
    width: 100%;
  }
  .topmenu-button {
    width: 100%;
  }
  .topmenu-dropdown {
    left: 0;
    right: auto;
    min-width: min(320px, 100%);
  }
}

@media (max-width: 640px) {
  .topbar-tools-inline {
    flex-wrap: wrap;
  }
  .topbar-tools-inline .user-chip {
    order: 2;
    width: 100%;
    margin-left: 0;
  }
  .topbar-tools-inline form {
    width: auto;
  }
}


/* Dashboard disclosure and login workspace relocation */
.dashboard-risk-disclosure {
  margin: 12px 0 22px;
}
.dashboard-risk-disclosure > summary {
  padding: 18px 22px;
  font-size: 16px;
}
.dashboard-risk-disclosure .prompt-bank-body {
  padding-top: 4px;
}
.dashboard-risk-grid {
  margin: 0;
}
.login-workspace-strip {
  margin-top: 18px;
}
.login-workspace-strip .workspace-card {
  min-height: 100%;
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.12);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.login-workspace-strip .workspace-card h3 {
  color: #fff;
}
.login-workspace-strip .workspace-card p {
  color: rgba(255,255,255,.76);
}
.login-workspace-strip .workspace-icon {
  background: rgba(255,255,255,.14);
  color: #fff;
}
@media (max-width: 1080px) {
  .dashboard-risk-disclosure > summary {
    padding: 16px 18px;
  }
  .login-workspace-strip {
    grid-template-columns: 1fr;
  }
}


@media (max-width: 1100px) {
  .passport-grid .info-tile {
    min-height: 116px;
  }

  .passport-grid .info-tile strong {
    font-size: 15px;
  }
}


/* compact file widgets */
.compact-file-widget {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  margin-bottom: 10px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.82);
  border-radius: 14px;
}
.compact-file-widget__current {
  min-width: 0;
  display: grid;
  gap: 4px;
  flex: 1 1 auto;
}
.compact-file-widget__label,
.compact-file-widget__upload-label {
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--muted-strong);
}
.compact-file-widget__link {
  min-width: 0;
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--ink);
  text-decoration: none;
  font-weight: 650;
}
.compact-file-widget__link:hover {
  color: var(--brand);
}
.compact-file-widget__clear {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 650;
  color: var(--muted-strong);
  cursor: pointer;
}
.compact-file-widget__clear input {
  width: 16px;
  height: 16px;
  margin: 0;
}
.compact-file-widget__upload {
  display: grid;
  gap: 6px;
}
.embedded-form-wide .compact-file-widget__upload input[type="file"],
.compact-file-widget__upload input[type="file"] {
  width: 100%;
  min-width: 0;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: #fff;
  color: var(--ink);
}
@media (max-width: 720px) {
  .compact-file-widget {
    flex-direction: column;
    align-items: stretch;
  }
  .compact-file-widget__clear {
    justify-content: flex-start;
  }
}

.login-workspace-card-simple {
  display: block;
  padding: 24px 28px;
}
.login-workspace-card-simple h3 {
  margin-bottom: 10px;
}
.login-workspace-card-simple p {
  margin: 0;
}

/* Constructor section templates */
.constructor-filter-grid {
  grid-template-columns: minmax(220px, 1.2fr) minmax(220px, .9fr) minmax(180px, .8fr) auto;
}
.constructor-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 18px;
}
.constructor-card {
  padding: 22px;
  border-radius: 24px;
  background: linear-gradient(180deg, #ffffff 0%, #f6fafd 100%);
  border: 1px solid #dbe7f2;
  box-shadow: var(--shadow-xs);
}
.constructor-card-top {
  align-items: flex-start;
}
.constructor-description {
  margin: 14px 0 16px;
  min-height: 44px;
}
.constructor-meta-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}
.constructor-meta-grid div,
.constructor-core-meta div {
  padding: 14px 16px;
  border-radius: 18px;
  background: linear-gradient(180deg, #ffffff 0%, #f5f9fd 100%);
  border: 1px solid #deebf6;
}
.constructor-meta-grid span,
.constructor-core-meta span {
  display: block;
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 6px;
}
.constructor-meta-grid strong,
.constructor-core-meta strong {
  display: block;
  font-size: 15px;
  word-break: break-word;
}
.wrap-actions { flex-wrap: wrap; }
.action-column { display: grid; gap: 10px; justify-items: end; }
.constructor-shell .hero-actions { align-self: flex-start; }
.constructor-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.constructor-form-grid .full-span { grid-column: 1 / -1; }
.field-editor-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.constructor-form-grid textarea,
.constructor-form-grid input,
.constructor-form-grid select {
  width: 100%;
}
.error-text { color: var(--danger); display: block; margin-top: 6px; }
.layout-split.constructor-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.25fr);
  gap: 20px;
}
.constructor-field-list {
  display: grid;
  gap: 14px;
}
.constructor-field-card {
  padding: 18px;
  border-radius: 20px;
  background: #fff;
  border: 1px solid #dbe7f2;
}
.constructor-field-top {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
  margin-bottom: 10px;
}
.prompt-grid-constructor {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.constructor-prompt-card {
  padding: 18px;
  border-radius: 20px;
  border: 1px solid #dbe7f2;
  background: linear-gradient(180deg, #ffffff 0%, #f8fbfe 100%);
}
.constructor-prompt-card strong {
  display: block;
  margin-bottom: 10px;
}
@media (max-width: 1100px) {
  .constructor-filter-grid,
  .constructor-form-grid,
  .field-editor-grid,
  .prompt-grid-constructor,
  .layout-split.constructor-detail-grid,
  .constructor-meta-grid {
    grid-template-columns: 1fr;
  }
}

.section-card-note {
  margin: 0.35rem 0 0;
  color: rgba(255,255,255,0.78);
  font-size: 0.84rem;
  line-height: 1.4;
}

.field-file-current {
  margin-top: 0.45rem;
  font-size: 0.84rem;
  color: #475569;
  word-break: break-word;
}

.field-file-current a {
  color: #0f4fbf;
  font-weight: 600;
}

.template-meta-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
  align-items: center;
}
.template-meta-inline-hero {
  margin-top: 14px;
}
.template-meta-inline-section {
  margin-top: 12px;
}
.template-badge,
.snapshot-badge,
.legacy-badge,
.template-source-link {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
}
.template-badge {
  background: rgba(15, 23, 42, 0.07);
  color: #1e293b;
}
.snapshot-badge {
  background: rgba(37, 99, 235, 0.12);
  color: #1d4ed8;
}
.legacy-badge {
  background: rgba(148, 163, 184, 0.18);
  color: #475569;
}
.template-source-link {
  background: rgba(15, 23, 42, 0.06);
  color: #0f172a;
}
.template-source-link:hover {
  background: rgba(37, 99, 235, 0.12);
  color: #1d4ed8;
}
.section-preview-description {
  margin: 10px 0 0;
}
.preview-form-stack {
  display: grid;
  gap: 14px;
}
.preview-form-field {
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 18px;
  padding: 16px;
  background: rgba(255,255,255,0.85);
}
.preview-form-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.version-table {
  display: grid;
  gap: 12px;
}
.version-row {
  display: grid;
  grid-template-columns: 120px 180px minmax(0,1fr) auto;
  gap: 16px;
  align-items: center;
  padding: 16px 18px;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 18px;
  background: rgba(255,255,255,0.88);
}
.version-row strong { display:block; }
.version-row-actions { justify-self: end; }
@media (max-width: 980px) {
  .version-row {
    grid-template-columns: 1fr;
    align-items: start;
  }
  .version-row-actions {
    justify-self: start;
  }
  .preview-form-head {
    flex-direction: column;
    align-items: start;
  }
}

.migration-layout {
  align-items: start;
}

.compact-info-grid .info-tile {
  min-height: 0;
}

.mapping-table-wrap {
  overflow-x: auto;
}

.mapping-table th,
.mapping-table td {
  vertical-align: top;
}

.mapping-status {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.25rem 0.6rem;
  font-size: 0.78rem;
  font-weight: 700;
}

.mapping-status.matched {
  background: rgba(18, 147, 98, 0.16);
  color: #0f7a53;
}

.mapping-status.unmatched {
  background: rgba(189, 42, 56, 0.14);
  color: #ad2131;
}

.mapping-status.pending {
  background: rgba(27, 73, 140, 0.14);
  color: #1a3a73;
}

.mini-template-card {
  border: 1px solid rgba(14, 34, 70, 0.12);
  border-radius: 18px;
  padding: 1rem;
  background: rgba(255, 255, 255, 0.9);
  display: grid;
  gap: 0.35rem;
}

.template-preview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
}

.candidate-template-list {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
}

.notice-block {
  background: rgba(250, 252, 255, 0.92);
  border: 1px solid rgba(14, 34, 70, 0.12);
  border-radius: 18px;
  padding: 1rem 1.15rem;
  margin-top: 1rem;
}

.checkbox-card {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.checkbox-card input {
  width: auto;
}

.filter-actions {
  align-self: end;
}

.system-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 1rem;
}

.system-card {
  min-height: 0;
}

.system-layout {
  align-items: start;
}

.system-paths {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
}

.system-last-backup {
  display: grid;
  gap: 0.5rem;
}

.monospace-line {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.85rem;
  line-height: 1.4;
  word-break: break-word;
  color: rgba(24, 35, 64, 0.8);
}

.event-log-list {
  display: grid;
  gap: 1rem;
}

.event-log-item {
  border: 1px solid rgba(14, 34, 70, 0.12);
  border-radius: 18px;
  padding: 1rem 1.1rem;
  background: rgba(255, 255, 255, 0.92);
  display: grid;
  gap: 0.45rem;
}

.event-log-item.event-level-warning {
  border-color: rgba(180, 128, 24, 0.28);
}

.event-log-item.event-level-error,
.event-log-item.event-level-critical {
  border-color: rgba(189, 42, 56, 0.24);
}

.event-log-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.event-payload summary {
  cursor: pointer;
  color: rgba(14, 34, 70, 0.82);
  font-weight: 700;
}

.event-payload pre {
  margin: 0.75rem 0 0;
  padding: 0.9rem 1rem;
  border-radius: 14px;
  background: rgba(13, 27, 50, 0.9);
  color: rgba(244, 248, 255, 0.95);
  overflow-x: auto;
  font-size: 0.83rem;
}


.user-detail-layout {
  align-items: start;
}

.table-person-cell {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.user-avatar.small {
  width: 2.2rem;
  height: 2.2rem;
  font-size: 0.9rem;
}

.list-pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding-top: 1rem;
}

.compact-list-stack {
  display: grid;
  gap: 0.85rem;
}

.list-row-card {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.1rem;
  border-radius: 18px;
  background: rgba(255,255,255,0.7);
  border: 1px solid rgba(15, 23, 42, 0.08);
  text-decoration: none;
  color: inherit;
}

.list-row-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08);
}

.import-row-errors {
  margin-top: 6px;
  max-width: 38ch;
  line-height: 1.35;
}

.field-card-checkbox {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.checkbox-inline {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
}


/* ===== UI polish patch: typography, tables, spacing, responsive fixes ===== */
.container {
  padding: 28px 24px 60px;
}
.page-shell {
  gap: 28px;
}
.grid,
.stack-column,
.project-module-stack,
.stack-gap-lg {
  gap: 28px;
}
.hero,
.panel,
.card {
  padding: 28px;
}
.hero-premium,
.hero-dashboard {
  padding: 36px 38px;
}
.compact-hero {
  padding: 30px 34px;
}
.hero-grid {
  gap: 30px;
}
.hero-main {
  gap: 16px;
}
.hero h1 {
  font-size: clamp(28px, 2.7vw, 40px);
  line-height: 1.08;
  overflow-wrap: anywhere;
  text-wrap: balance;
}
.hero-text,
.hero p {
  overflow-wrap: anywhere;
}
.hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: fit-content;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.14);
  color: rgba(255,255,255,.94);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.route-item > div,
.project-card-top > div,
.project-card-header > div,
.section-card-header > div,
.attention-title-row > div,
.list-card-top > div,
.glass-card-header > div,
.panel-header > div,
.page-header > div {
  min-width: 0;
  flex: 1;
}
.route-item strong,
.route-item small,
.project-card h3,
.section-card h3,
.attention-item h3,
.list-card strong,
.hero-side-metric span,
.hero-side-metric small,
.hero-side-metric strong,
.status-line strong,
.status-line span {
  overflow-wrap: anywhere;
}
.project-card h3,
.section-card h3,
.attention-item h3 {
  font-size: clamp(18px, 1.45vw, 22px);
  line-height: 1.22;
  margin-bottom: 0;
}
.list-card-top {
  gap: 16px;
}
.list-card-top strong {
  display: block;
  font-size: clamp(17px, 1.35vw, 21px);
  line-height: 1.25;
}
.badge {
  max-width: 100%;
  white-space: normal;
  line-height: 1.22;
  text-align: center;
}
.project-card-top .badge,
.project-card-header .badge,
.attention-title-row .badge,
.list-card-top .badge,
.section-card-header .badge {
  flex: 0 0 auto;
  max-width: min(180px, 100%);
}
.hero-side-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.hero-side-metric {
  min-height: 138px;
  align-content: start;
}
.hero-side-metric strong {
  font-size: clamp(22px, 2.2vw, 34px);
  line-height: 1.12;
}
.stat-card {
  min-height: 126px;
}
.stat-label {
  line-height: 1.35;
}
.stat-value {
  font-size: clamp(26px, 2.1vw, 36px);
  line-height: 1.08;
  white-space: normal;
  overflow-wrap: anywhere;
}
.info-grid {
  gap: 16px;
}
.info-tile {
  gap: 14px;
  min-height: 96px;
}
.info-tile strong {
  font-size: clamp(22px, 2vw, 32px);
  line-height: 1.12;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: right;
  max-width: 100%;
}
.info-tile-textual {
  grid-template-columns: 1fr;
  align-items: start;
  min-height: 0;
}
.info-tile-textual .info-tile-text,
.info-tile-textual .info-tile-content,
.info-tile-textual strong {
  display: block;
  justify-self: start;
  text-align: left;
  font-size: clamp(15px, 1.35vw, 21px);
  line-height: 1.35;
  color: #102235;
  max-width: 100%;
}
.info-tile-textual .badge {
  max-width: none;
}
.compact-timeline li {
  padding-bottom: 14px;
}
.stack-column .project-card-grid,
.layout-dashboard > aside .project-card-grid {
  grid-template-columns: 1fr;
}

.card-actions-inline form,
.button-row form,
.hero-actions form {
  display: inline-flex;
  margin: 0;
}

.card-actions-inline {
  justify-content: flex-start;
}

.table-shell,
.mapping-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid #dbe7f2;
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(246,250,253,.98) 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
.table-shell table,
.mapping-table-wrap table,
table.version-table,
.data-table {
  width: max(100%, 940px);
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  display: table;
}
table.version-table {
  gap: 0;
}
.data-table th,
.data-table td,
table.version-table th,
table.version-table td {
  padding: 14px 16px;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
  line-height: 1.45;
}
.data-table thead th,
table.version-table thead th {
  background: #f6fafe;
  color: var(--muted);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .05em;
  text-transform: uppercase;
  white-space: nowrap;
}
.data-table tbody tr:hover,
table.version-table tbody tr:hover {
  background: rgba(15, 76, 129, 0.03);
}
.data-table tbody tr:last-child td,
table.version-table tbody tr:last-child td {
  border-bottom: 0;
}
.data-table td strong,
table.version-table td strong {
  display: block;
  color: #11263a;
  font-size: 15px;
  line-height: 1.35;
}
.data-table td,
table.version-table td {
  overflow-wrap: anywhere;
}
.data-table td:last-child,
.data-table th:last-child,
table.version-table td:last-child,
table.version-table th:last-child {
  width: 1%;
  white-space: nowrap;
}
.data-table .badge,
table.version-table .badge {
  max-width: 160px;
}
.table-shell .muted-light,
.mapping-table-wrap .muted-light {
  color: var(--muted);
}

.two-column-layout {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  align-items: start;
}
.field-grid {
  display: grid;
  gap: 16px;
}
.field-grid.two-col-tight {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.filters-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1.4fr) repeat(3, minmax(180px, 1fr)) auto;
  gap: 14px;
  align-items: end;
}
.filters-grid-tight {
  grid-template-columns: repeat(2, minmax(0, 1fr)) auto;
}
.filters-grid input,
.filters-grid select,
.filters-grid textarea {
  width: 100%;
  min-height: 48px;
}
.project-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}
.project-grid-tight {
  gap: 20px;
}
.project-card-rich {
  padding: 22px;
  gap: 16px;
}
.project-card-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 16px;
}
.project-card-body {
  display: grid;
  gap: 16px;
  min-width: 0;
}

@media (max-width: 1400px) {
  .filters-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 1220px) {
  .page-shell,
  .grid,
  .stack-column,
  .project-module-stack,
  .stack-gap-lg,
  .two-column-layout,
  .project-grid {
    gap: 22px;
  }
  .panel,
  .card,
  .hero,
  .hero-premium,
  .hero-dashboard,
  .compact-hero {
    padding: 24px;
  }
}
@media (max-width: 980px) {
  .two-column-layout,
  .project-grid,
  .field-grid.two-col-tight,
  .filters-grid,
  .filters-grid-tight,
  .hero-side-grid {
    grid-template-columns: 1fr;
  }
  .table-shell table,
  .mapping-table-wrap table,
  table.version-table,
  .data-table {
    width: max(100%, 760px);
  }
}
@media (max-width: 720px) {
  .container {
    padding: 18px 14px 40px;
  }
  .page-shell,
  .grid,
  .stack-column,
  .project-module-stack,
  .stack-gap-lg,
  .two-column-layout,
  .project-grid {
    gap: 18px;
  }
  .panel,
  .card,
  .hero,
  .hero-premium,
  .hero-dashboard,
  .compact-hero {
    padding: 20px;
    border-radius: 22px;
  }
  .hero h1 {
    font-size: clamp(24px, 7vw, 32px);
  }
  .project-card h3,
  .section-card h3,
  .attention-item h3,
  .list-card-top strong {
    font-size: 18px;
  }
  .info-tile strong {
    font-size: clamp(18px, 5vw, 24px);
  }
}


/* ===== Missing utility classes used by templates ===== */
.list-stack {
  display: grid;
  gap: 14px;
}
.compact-row {
  gap: 10px;
}
.stack-gap-md {
  gap: 18px;
}
.two-up {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.three-columns {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.span-3 {
  grid-column: span 3;
}
.risk-card-wide {
  gap: 14px;
}
.corporate-timeline {
  gap: 14px;
}
.form-control {
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid var(--line-strong);
  background: rgba(255,255,255,.96);
  color: var(--text);
}
.field-help {
  margin-top: 6px;
  font-size: 12px;
  color: var(--muted);
}
.field-error,
.form-error,
.errorlist {
  margin-top: 6px;
  font-size: 12px;
  color: var(--danger);
}
.form-errors {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid rgba(185, 28, 28, 0.22);
  border-radius: 10px;
  background: rgba(254, 242, 242, 0.9);
  color: var(--danger);
  font-size: 13px;
  line-height: 1.4;
}
.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 1180px) {
  .three-columns,
  .two-up {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .span-3 {
    grid-column: span 2;
  }
}
@media (max-width: 900px) {
  .three-columns,
  .two-up {
    grid-template-columns: 1fr;
  }
  .span-3 {
    grid-column: auto;
  }
}


/* ===== UI polish patch 02 ===== */
.reports-actions-panel {
  align-self: start;
}
.reports-actions-panel .panel-header {
  margin-bottom: 8px;
}
.reports-actions-row {
  margin-top: 0;
}
.reports-actions-row .button {
  min-width: 186px;
}
.compact-disclosure {
  margin-top: 14px;
}
.compact-disclosure summary {
  padding-top: 12px;
  padding-bottom: 12px;
  font-size: 15px;
}
.report-pack-disclosure .prompt-bank-body {
  padding-top: 6px;
}
.reports-route-list .route-item {
  padding: 12px 14px;
}
.reports-route-list .route-item strong {
  font-size: 15px;
  line-height: 1.25;
}
.reports-route-list .route-item small {
  font-size: 13px;
  line-height: 1.45;
}
.dashboard-disclosure {
  margin: 0;
}
.dashboard-disclosure > summary {
  padding: 16px 20px;
  font-size: 16px;
}
.dashboard-disclosure .prompt-bank-body {
  gap: 14px;
}
.disclosure-note {
  margin: 0;
}
.attention-disclosure {
  align-self: start;
}
.attention-scroll {
  max-height: 540px;
  overflow: auto;
  padding-right: 6px;
}
.attention-scroll::-webkit-scrollbar {
  width: 10px;
}
.attention-scroll::-webkit-scrollbar-thumb {
  background: rgba(76, 112, 145, 0.28);
  border-radius: 999px;
}
.attention-scroll::-webkit-scrollbar-track {
  background: rgba(220, 231, 240, 0.5);
  border-radius: 999px;
}
@media (max-width: 980px) {
  .reports-actions-row .button {
    min-width: 0;
    flex: 1 1 220px;
  }
}
@media (max-width: 720px) {
  .attention-scroll {
    max-height: 420px;
  }
  .dashboard-disclosure > summary,
  .compact-disclosure summary {
    padding-left: 16px;
    padding-right: 16px;
  }
}


/* --- Sprint 17 AI chat --- */
.ai-chat-layout {
  display: grid;
  grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
  gap: 24px;
  align-items: start;
}
.chat-list {
  display: grid;
  gap: 12px;
}
.chat-list-item.is-active {
  border-color: rgba(12, 89, 156, 0.35);
  box-shadow: 0 12px 24px rgba(9, 40, 80, 0.08);
}
.chat-thread-shell {
  border: 1px solid rgba(167, 186, 207, 0.35);
  border-radius: 24px;
  background: rgba(247, 250, 253, 0.92);
  padding: 18px;
}
.chat-thread {
  display: grid;
  gap: 14px;
  max-height: 720px;
  overflow-y: auto;
  padding-right: 6px;
}
.chat-bubble {
  border-radius: 22px;
  padding: 16px 18px;
  border: 1px solid rgba(167, 186, 207, 0.4);
  background: #ffffff;
}
.chat-bubble.user {
  background: rgba(16, 95, 166, 0.08);
  border-color: rgba(16, 95, 166, 0.18);
}
.chat-bubble.assistant {
  background: rgba(255, 255, 255, 0.98);
}
.chat-bubble-meta {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: center;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 13px;
}
.chat-bubble-body {
  color: var(--ink);
  line-height: 1.7;
  word-break: break-word;
}
.chat-bubble-usage {
  margin-top: 10px;
  font-size: 12px;
  color: var(--muted);
}
.chat-input-form {
  display: grid;
  gap: 14px;
}
.chat-input-card textarea {
  min-height: 140px;
}
@media (max-width: 1200px) {
  .ai-chat-layout {
    grid-template-columns: 1fr;
  }
}


/* --- Sprint 17 hotfix: AI chat visibility + surface colors --- */
.panel .route-list-vertical.route-list-surface .route-item > div {
  min-width: 0;
}
.panel .route-list-vertical.route-list-surface .route-item strong {
  color: #18324a;
  white-space: normal;
  word-break: break-word;
}
.panel .route-list-vertical.route-list-surface .route-item small {
  color: var(--muted);
  white-space: normal;
  word-break: break-word;
}
.panel .route-list-vertical.route-list-surface .route-index {
  background: linear-gradient(135deg, #eef5fb 0%, #dfeaf6 100%);
  color: var(--primary);
  border-color: #d3e2f0;
}
.panel .route-list-vertical.route-list-surface .route-item .button.ghost {
  white-space: nowrap;
}
.hero-side-panel .download-tile,
.panel-dark-surface .download-tile {
  background: rgba(255,255,255,.09);
}
.hero-side-panel .download-tile strong,
.hero-side-panel .download-tile span,
.hero-side-panel .download-tile small,
.panel-dark-surface .download-tile strong,
.panel-dark-surface .download-tile span,
.panel-dark-surface .download-tile small {
  color: rgba(255,255,255,.96);
}

/* --- UI polish 03: project detail compaction + AI workspace cards --- */
.attachment-card-body-only {
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
}
.attachment-card-body-only .attachment-body {
  min-width: 0;
}
.attachment-card-body-only strong {
  display: block;
  font-size: 15px;
  line-height: 1.45;
}
.attachment-card-body-only .muted {
  margin-top: 6px;
}
.attachment-card-body-only .attachment-body > div:last-child {
  margin-top: 8px;
  line-height: 1.55;
  color: #18324a;
}

.deadline-summary-panel {
  align-self: start;
}
.deadline-summary-panel .info-grid {
  gap: 12px;
}
.deadline-summary-panel .info-tile {
  min-height: 0;
  padding: 18px 20px;
}
.deadline-summary-panel .info-tile span {
  font-size: 12px;
  line-height: 1.3;
  letter-spacing: .04em;
}
.deadline-summary-panel .info-tile strong {
  font-size: clamp(18px, 1.6vw, 24px);
  line-height: 1.12;
}
.deadline-focus-scroll {
  max-height: 320px;
  overflow: auto;
  padding-right: 4px;
  margin-top: 6px;
}
.deadline-focus-scroll::-webkit-scrollbar {
  width: 8px;
}
.deadline-focus-scroll::-webkit-scrollbar-thumb {
  background: rgba(76, 112, 145, 0.24);
  border-radius: 999px;
}
.deadline-summary-panel .timeline li {
  padding-bottom: 12px;
}

.project-stage-panel {
  align-self: start;
}
.project-stage-panel .info-grid {
  gap: 12px;
}
.project-stage-panel .info-tile {
  min-height: 0;
  padding: 18px 20px;
}
.project-stage-panel .info-tile-textual .info-tile-text,
.project-stage-panel .info-tile-textual .info-tile-content,
.project-stage-panel .info-tile-textual strong {
  font-size: clamp(14px, 1.15vw, 18px);
  line-height: 1.45;
}
.status-timeline-disclosure {
  margin-top: 14px;
}
.status-timeline-disclosure .prompt-bank-body {
  padding-top: 8px;
}
.status-timeline-disclosure .route-item {
  padding: 12px 14px;
}
.status-timeline-disclosure .route-item strong {
  font-size: 14px;
}
.status-timeline-disclosure .route-item small {
  font-size: 12px;
  line-height: 1.45;
}
.project-stage-panel .compact-timeline {
  margin-top: 16px;
}

.project-export-layout {
  align-items: start;
}
.project-export-panel,
.project-export-side-panel {
  align-self: start;
}
.project-export-panel .panel-header {
  margin-bottom: 6px;
}
.export-pack-disclosure {
  margin-top: 8px;
}
.project-export-panel .hero-actions.export-actions-large {
  margin-top: 14px;
  gap: 12px;
}
.project-export-panel .button,
.project-export-side-panel .button {
  min-width: 0;
}
.project-export-side-panel .route-item {
  padding: 12px 14px;
}
.project-export-side-panel .route-item strong {
  font-size: 14px;
}
.project-export-side-panel .route-item small {
  font-size: 12px;
  line-height: 1.45;
}

@media (max-width: 720px) {
  .deadline-summary-panel .info-tile strong {
    font-size: clamp(16px, 6vw, 22px);
  }
  .deadline-focus-scroll {
    max-height: 260px;
  }
}

/* --- Sprint 17 test chat + UI compacting --- */
.ai-chat-layout-test {
  grid-template-columns: minmax(280px, 360px) minmax(0, 1fr);
}
.stat-grid-single-column {
  grid-template-columns: 1fr;
}
.top-gap-sm {
  margin-top: 12px;
}
.attachment-card-body-only {
  grid-template-columns: 1fr;
  gap: 0;
}
.attachment-card-body-only .attachment-body {
  min-width: 0;
}
.attachment-card-body-only strong,
.attachment-card-body-only .muted,
.attachment-card-body-only div {
  white-space: normal;
  word-break: normal;
  overflow-wrap: anywhere;
  line-height: 1.45;
}
.project-gap-list {
  max-height: 640px;
  overflow-y: auto;
  padding-right: 6px;
}
.project-gap-list::-webkit-scrollbar,
.status-history-scroll::-webkit-scrollbar,
.deadline-focus-scroll::-webkit-scrollbar {
  width: 10px;
}
.project-gap-list::-webkit-scrollbar-thumb,
.status-history-scroll::-webkit-scrollbar-thumb,
.deadline-focus-scroll::-webkit-scrollbar-thumb {
  background: rgba(76, 112, 145, 0.28);
  border-radius: 999px;
}
.project-gap-list::-webkit-scrollbar-track,
.status-history-scroll::-webkit-scrollbar-track,
.deadline-focus-scroll::-webkit-scrollbar-track {
  background: rgba(220, 231, 240, 0.5);
  border-radius: 999px;
}
.deadline-summary-panel .info-grid {
  gap: 14px;
}
.deadline-summary-panel .info-tile {
  min-height: 96px;
  padding: 16px 18px;
}
.deadline-summary-panel .info-tile strong {
  font-size: clamp(20px, 2.2vw, 30px);
  line-height: 1.08;
}
.deadline-summary-panel .info-tile span {
  font-size: 11px;
}
.deadline-summary-panel .hero-chip-row {
  margin-top: 12px;
}
.deadline-focus-scroll {
  max-height: 320px;
  overflow-y: auto;
  padding-right: 6px;
}
.project-stage-panel .panel-header {
  margin-bottom: 10px;
}
.project-stage-panel .info-grid {
  gap: 10px;
}
.project-stage-panel .info-tile {
  min-height: 0;
  padding: 16px 18px;
}
.project-stage-panel .info-tile-textual .info-tile-text,
.project-stage-panel .info-tile-textual .info-tile-content,
.project-stage-panel .info-tile-textual strong {
  font-size: clamp(13px, 1.05vw, 16px);
  line-height: 1.5;
}
.status-history-disclosure {
  margin-top: 14px;
}
.status-history-scroll {
  max-height: 240px;
  overflow-y: auto;
  padding-right: 6px;
}
.compact-export-panel .panel-header {
  margin-bottom: 8px;
}
.export-actions-compact {
  margin-top: 0;
  gap: 12px;
}
.export-actions-compact .button {
  min-width: 0;
}
.compact-export-panel .compact-disclosure {
  margin-top: 12px;
}
.compact-export-panel .prompt-bank-body {
  padding-top: 8px;
}
.compact-export-panel .route-item {
  padding: 12px 14px;
}
.compact-export-panel .route-item strong {
  font-size: 14px;
}
.compact-export-panel .route-item small {
  font-size: 12px;
  line-height: 1.45;
}
@media (max-width: 1200px) {
  .ai-chat-layout-test {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .project-gap-list {
    max-height: 460px;
  }
  .deadline-focus-scroll,
  .status-history-scroll {
    max-height: 260px;
  }
}


/* --- AI chat hotfix 09 --- */
.ai-chat-layout-test {
  grid-template-columns: minmax(320px, 420px) minmax(0, 1fr);
}
.stat-grid-single-column {
  grid-template-columns: repeat(2, minmax(140px, 1fr));
}
.ai-chat-stats {
  gap: 14px;
}
.ai-chat-stats .stat-card {
  min-height: 122px;
  padding: 18px 18px;
}
.ai-chat-stats .stat-label {
  margin-bottom: 8px;
}
.ai-chat-stats .stat-value {
  font-size: clamp(24px, 2vw, 32px);
}
.ai-chat-stats .stat-note {
  margin-top: 8px;
  font-size: 12px;
}
@media (max-width: 900px) {
  .ai-chat-layout-test {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .stat-grid-single-column,
  .ai-chat-stats {
    grid-template-columns: 1fr;
  }
}

.ai-chat-layout-balanced {
  grid-template-columns: minmax(300px, 360px) minmax(0, 1fr);
}

.compact-scroll-box {
  max-height: 420px;
  overflow-y: auto;
  padding-right: 0.25rem;
}

.ai-chat-stats-wide {
  grid-template-columns: repeat(4, minmax(180px, 1fr));
}

.ai-chat-stats-wide .stat-card {
  min-height: 148px;
}

.ai-chat-stats-wide .stat-value {
  font-size: clamp(2rem, 3vw, 2.8rem);
}

@media (max-width: 1100px) {
  .ai-chat-layout-balanced {
    grid-template-columns: 1fr;
  }

  .ai-chat-stats-wide {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }
}

@media (max-width: 640px) {
  .ai-chat-stats-wide {
    grid-template-columns: 1fr;
  }
}

/* --- UI patch 11: hard-lock compact deadline metrics --- */
.deadline-panel .deadline-metrics-grid .info-tile,
.deadline-summary-panel .info-grid .info-tile {
  min-height: 88px !important;
  padding: 14px 16px !important;
}

.deadline-panel .deadline-metrics-grid .info-tile span,
.deadline-summary-panel .info-grid .info-tile span {
  font-size: 11px !important;
  line-height: 1.3 !important;
  letter-spacing: .03em !important;
}

.deadline-panel .deadline-metrics-grid .info-tile strong,
.deadline-summary-panel .info-grid .info-tile strong {
  font-size: clamp(15px, 1.45vw, 22px) !important;
  line-height: 1.06 !important;
  letter-spacing: -0.02em !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

.deadline-panel .deadline-metrics-grid .info-tile:first-child strong,
.deadline-panel .deadline-metrics-grid .info-tile:nth-child(2) strong,
.deadline-summary-panel .info-grid .info-tile:first-child strong,
.deadline-summary-panel .info-grid .info-tile:nth-child(2) strong {
  font-size: clamp(14px, 1.35vw, 20px) !important;
}

.deadline-panel .deadline-metrics-grid,
.deadline-summary-panel .info-grid {
  gap: 12px !important;
}

@media (max-width: 900px) {
  .deadline-panel .deadline-metrics-grid .info-tile strong,
  .deadline-summary-panel .info-grid .info-tile strong {
    font-size: clamp(14px, 4.8vw, 20px) !important;
  }

  .deadline-panel .deadline-metrics-grid .info-tile:first-child strong,
  .deadline-panel .deadline-metrics-grid .info-tile:nth-child(2) strong,
  .deadline-summary-panel .info-grid .info-tile:first-child strong,
  .deadline-summary-panel .info-grid .info-tile:nth-child(2) strong {
    font-size: clamp(14px, 4.2vw, 18px) !important;
  }
}


/* --- Stage 15: live AI output + sticky compact page header --- */
.topmenu-label {
  display: block;
  font-weight: 700;
  line-height: 1.35;
}
.hero-mini-host {
  position: static;
  z-index: 34;
}
.hero-mini-bar {
  position: fixed;
  top: var(--hero-mini-top, 14px);
  left: var(--hero-mini-left, 18px);
  width: var(--hero-mini-width, calc(100vw - 36px));
  z-index: 34;
  opacity: 0;
  transform: translateY(-8px) scale(0.985);
  pointer-events: none;
  visibility: hidden;
  transition: opacity .24s ease, transform .24s ease, visibility .24s ease;
}
.hero-mini-bar.visible {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
  visibility: visible;
}
.hero-mini-bar--compact .hero-mini-bar-inner {
  padding: 10px 14px;
}
.hero-mini-bar--compact .hero-mini-title {
  font-size: 16px;
}
.hero-mini-bar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 16px;
  border-radius: 18px;
  background: rgba(11, 28, 45, 0.9);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 16px 34px rgba(7, 21, 35, 0.16);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.hero-mini-title {
  min-width: 0;
  color: rgba(255,255,255,.97);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hero-mini-toggle {
  flex: 0 0 auto;
}
.ai-side-panel-tight {
  max-width: 430px;
  margin-left: auto;
}
.ai-config-stack-compact {
  gap: 12px;
}
.ai-config-stack-compact .download-tile {
  padding: 14px 16px;
}
.ai-chat-hub-hero {
  grid-template-columns: minmax(0, 1.2fr) minmax(320px, 430px);
}
.chat-header-actions {
  min-width: 0;
}
.chat-title-form {
  min-width: 0;
}
.chat-title-form input[type="text"] {
  min-height: 46px;
}
.chat-header-tools .button,
.chat-title-form .button {
  min-width: 0;
}
.ai-chat-layout-history .chat-list-item,
.ai-chat-layout-history .attachment-card {
  min-width: 0;
}
.ai-chat-layout-history .compact-scroll-box {
  scrollbar-gutter: stable both-edges;
}
@media (max-width: 1280px) {
  .ai-chat-hub-hero {
    grid-template-columns: 1fr;
  }
  .ai-side-panel-tight {
    max-width: none;
  }
}
@media (max-width: 760px) {
  .hero-mini-bar {
    top: max(10px, var(--hero-mini-top, 10px));
    left: var(--hero-mini-left, 12px);
    width: var(--hero-mini-width, calc(100vw - 24px));
  }
  .hero-mini-title {
    font-size: 15px;
  }
  .hero-mini-bar-inner {
    padding: 10px 12px;
  }
}

.wrap-gap {
  flex-wrap: wrap;
  gap: 10px;
}

.code-block-like {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 13px;
  line-height: 1.5;
  background: rgba(15, 23, 42, 0.04);
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 16px;
  padding: 16px 18px;
  color: #0f172a;
}

.field-grid.two-columns {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 860px) {
  .field-grid.two-columns {
    grid-template-columns: 1fr;
  }
}


/* ===== UI polish 02: shell compaction, checkbox refresh, image viewer ===== */
:root {
  --brand: var(--primary);
  --ink: var(--text);
  --muted-strong: #516577;
  --topbar-height: 86px;
}

body.image-viewer-open {
  overflow: hidden;
}

.topbar-wrap {
  padding: 12px 16px 0;
}
.topbar {
  border-radius: 22px;
}
.topbar-inner {
  min-height: var(--topbar-height);
  padding: 14px 18px;
  gap: 18px;
}
.brand-group,
.topbar-panel,
.topnav,
.topbar-tools,
.brand-copy {
  gap: 12px;
}
.brand-mark {
  width: 50px;
  height: 50px;
  border-radius: 16px;
}
.brand,
.brand:hover {
  font-size: 18px;
}
.brand-subtitle {
  font-size: 11px;
  line-height: 1.35;
  max-width: 620px;
}
.topmenu-button {
  min-width: 82px;
  padding: 10px 12px;
  border-radius: 14px;
  font-size: 14px;
}
.topmenu-dropdown {
  min-width: 228px;
  max-height: min(72vh, 560px);
  gap: 4px;
  padding: 8px;
  overflow: auto;
  border-radius: 18px;
}
.topmenu-link {
  gap: 8px;
  padding: 9px 11px;
  border-radius: 12px;
  font-size: 14px;
}
.topmenu-label {
  line-height: 1.25;
}
.container {
  padding: 18px 16px 42px;
}
.page-shell,
.grid,
.stack-column,
.project-module-stack,
.stack-gap-lg,
.project-grid,
.two-column-layout {
  gap: 18px;
}
.hero,
.hero-dashboard,
.compact-hero {
  padding: 24px 26px;
  border-radius: 24px;
}
.hero-grid {
  grid-template-columns: minmax(0, 1.35fr) minmax(290px, 0.85fr);
  gap: 18px;
}
.hero h1 {
  font-size: clamp(24px, 2.45vw, 34px);
  line-height: 1.08;
}
.hero-text {
  font-size: 14px;
}
.hero-chip-row,
.hero-actions {
  gap: 8px;
}
.chip,
.badge {
  min-height: 30px;
  padding: 6px 10px;
  font-size: 12px;
}
.panel,
.card {
  border-radius: 20px;
  padding: 18px;
}
.panel-header,
.page-header {
  gap: 12px;
  margin-bottom: 14px;
}
.panel-header-spacious {
  margin-bottom: 18px;
}
.stats-grid,
.workspace-strip,
.project-card-grid,
.section-card-grid,
.info-grid,
.showcase-grid {
  gap: 14px;
}
.stat-card {
  min-height: 108px;
  padding: 16px 18px;
  border-radius: 18px;
}
.stat-label {
  margin-bottom: 8px;
  font-size: 11px;
}
.stat-value {
  font-size: clamp(22px, 1.9vw, 31px);
}
.stat-note {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.35;
}
.workspace-card {
  gap: 12px;
  padding: 16px 18px;
  border-radius: 18px;
}
.workspace-card h3 {
  font-size: 17px;
}
.workspace-icon {
  min-width: 44px;
  height: 44px;
  border-radius: 14px;
}
.info-tile {
  grid-template-columns: 1fr;
  align-items: start;
  gap: 8px;
  min-height: 0;
  padding: 13px 14px;
}
.info-tile span {
  line-height: 1.35;
}
.info-tile strong {
  justify-self: start;
  text-align: left;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-size: clamp(18px, 1.65vw, 26px);
}
.project-tabs-panel {
  padding: 10px;
}
.project-tabs {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 8px;
}
.project-tab {
  gap: 3px;
  padding: 12px 13px;
  border-radius: 16px;
}
.project-tab-title {
  font-size: 14px;
  line-height: 1.25;
}
.project-tab-note {
  font-size: 11px;
  line-height: 1.3;
}
.project-action-strip-wrap {
  top: calc(var(--topbar-height) - 2px);
  margin-top: 8px;
}
.project-action-strip {
  width: min(1400px, calc(100vw - 24px));
  gap: 12px;
  padding: 8px 12px;
  border-radius: 16px;
}
.project-action-strip-main {
  gap: 10px;
  align-items: flex-start;
}
.project-action-strip-code {
  padding: 6px 9px;
  border-radius: 10px;
  font-size: 11px;
}
.project-action-strip-title {
  max-width: none;
  white-space: normal;
  line-height: 1.25;
  overflow-wrap: anywhere;
}
.project-action-nav {
  gap: 8px;
}
.project-action-link {
  padding: 8px 10px;
  border-radius: 12px;
  font-size: 13px;
}
.sticky-stack {
  top: calc(var(--topbar-height) + 20px);
}
.form-layout {
  gap: 12px;
}
.field-card {
  padding: 14px;
  border-radius: 16px;
}
.form-layout-rich .field-card::before {
  top: 10px;
  right: 12px;
  font-size: 10px;
}
label {
  margin-bottom: 6px;
  font-size: 14px;
}
input:not([type=checkbox]):not([type=radio]),
textarea,
select {
  border-radius: 14px;
  padding: 10px 12px;
}
textarea {
  min-height: 112px;
}
.compact-field {
  padding: 12px;
}
.compact-field label {
  margin-bottom: 6px;
}
.card-actions-wide .button {
  min-width: 0;
}
.badge,
.metric-chip,
.hero-side-metric strong,
.hero-side-metric span,
.hero-side-metric small,
.status-line strong,
.status-line span,
.project-action-strip-title,
.attachment-body a,
.attachment-body div,
.download-tile strong,
.download-tile small {
  overflow-wrap: anywhere;
}

input[type="checkbox"],
input.checkbox-field[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  margin: 0;
  border-radius: 6px;
  border: 1.5px solid #9bb2c7;
  background: linear-gradient(180deg, #ffffff 0%, #f2f7fb 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 1px 3px rgba(16, 33, 50, 0.08);
  display: inline-grid;
  place-content: center;
  cursor: pointer;
  transition: border-color .16s ease, background .16s ease, box-shadow .16s ease, transform .16s ease;
}
input[type="checkbox"]::before,
input.checkbox-field[type="checkbox"]::before {
  content: "";
  width: 10px;
  height: 10px;
  transform: scale(0);
  transition: transform .14s ease;
  background: white;
  clip-path: polygon(14% 44%, 0 58%, 40% 100%, 100% 20%, 84% 4%, 38% 62%);
}
input[type="checkbox"]:checked,
input.checkbox-field[type="checkbox"]:checked {
  border-color: var(--primary);
  background: linear-gradient(180deg, #1b6ea8 0%, #0f4c81 100%);
  box-shadow: 0 0 0 3px rgba(15, 76, 129, 0.12);
}
input[type="checkbox"]:checked::before,
input.checkbox-field[type="checkbox"]:checked::before {
  transform: scale(1);
}
input[type="checkbox"]:focus-visible,
input.checkbox-field[type="checkbox"]:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px rgba(15, 76, 129, 0.14);
}
.checkbox-inline,
.compact-field-checkbox label,
.compact-file-widget__clear,
.checkbox-card {
  gap: 10px;
}
.checkbox-inline {
  min-height: 0;
  padding: 0;
}
.checkbox-inline-compact {
  font-size: 12px;
  font-weight: 700;
}
.compact-file-widget {
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 14px;
}
.compact-file-widget__current-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.compact-file-widget__label,
.compact-file-widget__upload-label,
.compact-file-widget__clear {
  color: var(--muted-strong);
}
.compact-file-widget__link {
  color: var(--ink);
}
.compact-file-widget__link:hover {
  color: var(--brand);
}
.attachment-card {
  gap: 12px;
}
.attachment-icon-media {
  padding: 0;
  overflow: hidden;
  background: #eef4f9;
}
.attachment-icon-media img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}
.image-preview-link,
.attachment-icon-media,
.reference-preview-media,
.project-reference-hero {
  cursor: zoom-in;
}
.reference-preview-media {
  display: block;
}
.reference-preview-media img {
  width: 100%;
  display: block;
}
.image-viewer {
  position: fixed;
  inset: 0;
  z-index: 120;
}
.image-viewer__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(7, 16, 28, 0.82);
  backdrop-filter: blur(8px);
}
.image-viewer__dialog {
  position: relative;
  z-index: 1;
  width: min(96vw, 1280px);
  margin: 2.5vh auto;
  padding: 18px 18px 14px;
  border-radius: 22px;
  background: rgba(17, 29, 42, 0.96);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 32px 70px rgba(0,0,0,.32);
}
.image-viewer__frame {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: min(70vh, 760px);
}
.image-viewer__image {
  display: block;
  max-width: 100%;
  max-height: 82vh;
  border-radius: 16px;
  object-fit: contain;
  background: #0f1722;
}
.image-viewer__caption {
  margin-top: 10px;
  color: rgba(255,255,255,.82);
  font-size: 13px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.image-viewer__close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 38px;
  height: 38px;
  border: 0;
  border-radius: 999px;
  background: rgba(255,255,255,.1);
  color: white;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
}
@media (max-width: 980px) {
  .topbar-panel {
    flex-wrap: wrap;
    justify-content: flex-end;
  }
  .brand-subtitle {
    max-width: 100%;
  }
  .hero-grid,
  .project-overview-layout,
  .approvals-layout,
  .project-export-layout {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 720px) {
  .topbar-wrap {
    padding: 10px 10px 0;
  }
  .topbar-inner {
    padding: 12px 14px;
  }
  .brand-subtitle {
    display: none;
  }
  .container {
    padding: 16px 10px 32px;
  }
  .hero,
  .hero-dashboard,
  .compact-hero,
  .panel,
  .card {
    padding: 16px;
    border-radius: 18px;
  }
  .project-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .image-viewer__dialog {
    width: calc(100vw - 16px);
    margin: 8px auto;
    padding: 12px;
    border-radius: 16px;
  }
}


/* ===== UI polish stage 19B: forms, filters, tables, AI chat compaction ===== */
.panel-header.panel-header-spacious {
  gap: 14px;
  padding-bottom: 14px;
}
.panel-header.compact-header.compact-header-split {
  gap: 12px;
}
.form-layout,
.form-layout-rich,
.field-grid,
.assignment-form-grid-clean,
.assignment-fields-grid,
.assignment-fields-grid-inline,
.embedded-form-wide,
.embedded-form,
.stack-list {
  gap: 12px;
}
.form-layout-rich {
  counter-reset: fieldcount;
}
.field-card,
.assignment-fields-grid .field-card,
.assignment-fields-grid-inline .field-card,
.embedded-form-wide .field-card,
.embedded-form .field-card {
  padding: 12px 13px;
  border-radius: 14px;
}
.form-layout-rich .field-card::before {
  top: 8px;
  right: 10px;
  font-size: 9px;
  opacity: .48;
}
label,
.field-card label,
.compact-field label {
  margin-bottom: 5px;
  font-size: 13px;
  line-height: 1.35;
}
.helptext,
.help-text {
  font-size: 12px;
  line-height: 1.45;
}
input:not([type=checkbox]):not([type=radio]),
textarea,
select {
  font-size: 14px;
  line-height: 1.4;
  min-height: 42px;
}
textarea {
  min-height: 96px;
}
select[multiple] {
  min-height: 108px;
}
.filter-panel {
  padding: 18px;
}
.filter-grid,
.filters-grid,
.constructor-filter-grid {
  gap: 10px;
}
.filter-grid .field-card,
.filters-grid .field-card,
.constructor-filter-grid .field-card,
.filter-panel .field-card.compact-field {
  padding: 10px 12px;
  border-radius: 14px;
}
.filter-grid .field-card label,
.filters-grid .field-card label,
.constructor-filter-grid .field-card label {
  margin-bottom: 4px;
  font-size: 12px;
}
.filter-grid input,
.filter-grid select,
.filters-grid input,
.filters-grid select,
.constructor-filter-grid input,
.constructor-filter-grid select {
  min-height: 40px;
}
.filter-actions {
  gap: 8px;
  align-items: center;
}
.field-card > div,
.compact-field > div,
.field-card p,
.field-card small,
.field-card strong,
.field-card span {
  min-width: 0;
  overflow-wrap: anywhere;
}
.table-shell,
.mapping-table-wrap {
  border-radius: 16px;
  scrollbar-width: thin;
  scrollbar-color: rgba(49, 93, 128, 0.45) rgba(230, 239, 246, 0.9);
}
.table-shell table,
.mapping-table-wrap table,
table.version-table,
.data-table {
  width: max(100%, 860px);
}
.data-table th,
.data-table td,
table.version-table th,
table.version-table td {
  padding: 11px 12px;
  font-size: 13px;
  line-height: 1.4;
}
.data-table thead th,
table.version-table thead th {
  font-size: 11px;
  letter-spacing: .045em;
}
.data-table td strong,
table.version-table td strong {
  font-size: 14px;
}
.table-shell .button-row.compact-row,
.mapping-table-wrap .button-row.compact-row,
.data-table .button-row.compact-row,
table.version-table .button-row.compact-row {
  gap: 6px;
  justify-content: flex-end;
}
.data-table .button,
table.version-table .button {
  white-space: nowrap;
}
.table-shell::-webkit-scrollbar,
.mapping-table-wrap::-webkit-scrollbar {
  height: 10px;
}
.table-shell::-webkit-scrollbar-thumb,
.mapping-table-wrap::-webkit-scrollbar-thumb {
  background: rgba(49, 93, 128, 0.34);
  border-radius: 999px;
}
.table-shell::-webkit-scrollbar-track,
.mapping-table-wrap::-webkit-scrollbar-track {
  background: rgba(230, 239, 246, 0.8);
}
.card-actions-inline,
.button-row.compact-row {
  row-gap: 6px;
}
@media (max-width: 1100px) {
  .filter-grid,
  .filters-grid,
  .constructor-filter-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .table-shell table,
  .mapping-table-wrap table,
  table.version-table,
  .data-table {
    width: max(100%, 720px);
  }
}
@media (max-width: 720px) {
  .filter-grid,
  .filters-grid,
  .constructor-filter-grid {
    grid-template-columns: 1fr;
  }
  .field-card,
  .assignment-fields-grid .field-card,
  .assignment-fields-grid-inline .field-card,
  .embedded-form-wide .field-card,
  .embedded-form .field-card,
  .filter-grid .field-card,
  .filters-grid .field-card,
  .constructor-filter-grid .field-card {
    padding: 10px 11px;
  }
  .table-shell table,
  .mapping-table-wrap table,
  table.version-table,
  .data-table {
    width: max(100%, 640px);
  }
  .data-table th,
  .data-table td,
  table.version-table th,
  table.version-table td {
    padding: 10px 11px;
  }
}


/* === Stage 19C: project/detail cards, attachments, sections === */
.stack-gap-sm { margin-top: 12px; }
.stack-gap-md { margin-top: 16px; }

.project-ai-materials-panel .field-grid.two-col-tight {
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.project-ai-materials-panel .field-card.compact-field {
  padding: 11px 12px;
}
.project-ai-materials-panel .list-row-card {
  padding: 10px 12px;
}
.project-ai-materials-panel .list-row-card strong {
  overflow-wrap: anywhere;
}
.info-tile {
  min-height: 74px;
  align-items: start;
}
.info-tile strong {
  font-size: 24px;
  line-height: 1.15;
  white-space: normal;
  justify-self: start;
  text-align: left;
  overflow-wrap: anywhere;
}
.info-tile-textual {
  align-items: start;
}
.info-tile-textual .info-tile-content,
.info-tile-textual .info-tile-text {
  width: 100%;
}
.section-card-header-rich {
  grid-template-columns: 44px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}
.section-avatar {
  min-width: 44px;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  font-size: 12px;
}
.section-card-note {
  max-width: 72ch;
  overflow-wrap: anywhere;
}
.section-meta-grid-balanced {
  gap: 10px;
}
.section-meta-grid-balanced > span {
  padding: 10px 12px;
  border-radius: 14px;
  min-width: 0;
}
.section-meta-grid-balanced > span em {
  overflow-wrap: anywhere;
}
.section-stat-row {
  gap: 10px;
}
.metric-chip {
  padding: 10px 12px;
  min-height: 0;
}
.metric-chip strong {
  font-size: 18px;
  line-height: 1.2;
}
.hero-side-metric {
  padding: 10px 12px;
}
.hero-side-metric strong {
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.field-file-current {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  background: #f7fbfe;
  border: 1px solid #dce8f3;
  border-radius: 12px;
}
.field-file-current span {
  color: #5a6d82;
  font-weight: 600;
}
.field-file-current a {
  max-width: 100%;
  overflow-wrap: anywhere;
}
.attachment-list {
  gap: 10px;
}
.attachment-card,
.attachment-card-wide,
.attachment-card-responsive {
  grid-template-columns: 72px minmax(0, 1fr) auto;
  gap: 12px;
  padding: 14px;
}
.attachment-card-body-only {
  grid-template-columns: minmax(0, 1fr);
}
.attachment-icon,
.attachment-card-wide .attachment-icon {
  width: 72px;
  height: 58px;
  border-radius: 14px;
  font-size: 12px;
}
.attachment-icon-media img,
.attachment-card-wide .attachment-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}
.attachment-body {
  display: grid;
  gap: 4px;
  min-width: 0;
  align-content: start;
}
.attachment-body > * {
  min-width: 0;
}
.attachment-body a,
.attachment-body strong,
.attachment-body div {
  overflow-wrap: anywhere;
}
.attachment-body a {
  line-height: 1.35;
}
.attachment-card .button-row,
.attachment-card-wide .button-row {
  justify-content: flex-end;
  align-items: center;
  margin-left: auto;
}
.two-column-layout.user-detail-layout {
  gap: 14px;
}
.section-card .card-actions-wide {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.section-card .card-actions-wide .button {
  min-width: 0;
}
.section-card .assignment-fields-grid-inline {
  gap: 8px;
}
.section-card .assignment-submit-slot {
  align-self: end;
}

@media (max-width: 980px) {
  .section-card-header-rich {
    grid-template-columns: 44px minmax(0, 1fr);
  }
  .section-card-header-rich .badge {
    justify-self: start;
    grid-column: 1 / -1;
  }
  .section-meta-grid-balanced,
  .section-stat-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .attachment-card,
  .attachment-card-wide,
  .attachment-card-responsive {
    grid-template-columns: 72px minmax(0, 1fr);
  }
  .attachment-card .button-row,
  .attachment-card-wide .button-row {
    grid-column: 1 / -1;
    margin-left: 0;
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  .project-ai-materials-panel .field-grid.two-col-tight,
  .section-meta-grid-balanced,
  .section-stat-row,
  .two-column-layout.user-detail-layout {
    grid-template-columns: 1fr;
  }
  .attachment-card,
  .attachment-card-wide,
  .attachment-card-responsive {
    grid-template-columns: 1fr;
  }
  .attachment-icon,
  .attachment-card-wide .attachment-icon {
    width: 100%;
    max-width: 110px;
  }
  .info-tile {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .info-tile strong {
    font-size: 20px;
  }
}

/* === Stage 19D: style-island cleanup, registry consistency, responsive finishing === */
.report-table-top-gap {
  margin-top: 1rem;
}
.json-pretty-block {
  margin: 0;
  white-space: pre-wrap;
  word-break: break-word;
}
.ai-chat-error-message {
  color: #9b1c1c;
}
.ai-fill-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(300px, 400px);
  gap: 20px;
  align-items: start;
}
.ai-fill-card {
  display: grid;
  gap: 12px;
}
.ai-fill-diff {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.ai-fill-diff article {
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid #dbe7f2;
  background: #f8fbfe;
  min-width: 0;
}
.ai-fill-diff h4,
.ai-fill-note-list h4 {
  margin: 0 0 6px;
  font-size: 13px;
}
.ai-fill-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.ai-fill-note-list {
  display: grid;
  gap: 8px;
}
.ai-fill-note-list .mini-chip {
  margin-right: 6px;
}
.hero.compact-hero.hero-grid {
  gap: 18px;
}
.hero.compact-hero .hero-chip-row,
.hero.compact-hero .hero-actions.compact-row {
  row-gap: 8px;
}
.hero.compact-hero .hero-side-panel {
  max-width: 420px;
}
.attachment-list {
  gap: 10px;
}
.attachment-card-responsive {
  min-width: 0;
}
.attachment-card-responsive .mini-kicker,
.attachment-card-responsive strong,
.attachment-card-responsive .muted,
.attachment-card-responsive .chip,
.attachment-card-responsive .badge {
  overflow-wrap: anywhere;
}
.attachment-card-responsive .hero-chip-row {
  row-gap: 6px;
}
.attachment-card-responsive .button-row.compact-row.wrap-gap {
  row-gap: 6px;
  align-items: flex-start;
}
.attachment-card-responsive .button,
.panel .button-row.compact-row .button {
  min-width: 0;
}
.attachment-card-responsive .button-row form,
.chat-header-tools form {
  margin: 0;
}
.table-shell,
.mapping-table-wrap {
  overflow-x: auto;
  overscroll-behavior-x: contain;
}
.table-shell table,
.mapping-table-wrap table,
.data-table,
.version-table {
  table-layout: fixed;
}
.table-shell td,
.table-shell th,
.mapping-table-wrap td,
.mapping-table-wrap th,
.data-table td,
.data-table th,
.version-table td,
.version-table th {
  overflow-wrap: anywhere;
  vertical-align: top;
}
.table-shell td .button-row,
.mapping-table-wrap td .button-row,
.data-table td .button-row,
.version-table td .button-row {
  justify-content: flex-start;
}
.chat-panel-header,
.chat-header-actions,
.chat-actions-stack,
.chat-actions-cluster,
.ai-input-grid {
  min-width: 0;
}
.chat-header-actions,
.chat-actions-stack,
.chat-actions-cluster {
  justify-items: stretch;
}
.chat-header-tools {
  gap: 7px;
}
.chat-header-tools .button {
  min-width: 0;
  padding-inline: 12px;
}
.ai-attachment-pill {
  max-width: 100%;
}
@media (max-width: 1180px) {
  .ai-fill-grid {
    grid-template-columns: 1fr;
  }
  .hero.compact-hero.hero-grid {
    grid-template-columns: 1fr;
  }
  .hero.compact-hero .hero-side-panel,
  .hero.compact-hero .ai-side-panel-tight {
    max-width: none;
    margin-left: 0;
  }
  .chat-panel-header {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 980px) {
  .ai-chat-layout-history,
  .ai-chat-hero,
  .ai-chat-hub-hero {
    grid-template-columns: 1fr;
  }
  .ai-fill-diff {
    grid-template-columns: 1fr;
  }
  .attachment-card-responsive .button-row.compact-row.wrap-gap,
  .attachment-card-responsive .button-row.compact-row {
    justify-content: flex-start;
  }
  .table-shell table,
  .mapping-table-wrap table,
  .data-table,
  .version-table {
    width: max(100%, 680px);
  }
}
@media (max-width: 760px) {
  .attachment-card-responsive,
  .attachment-card-responsive.attachment-card-rich,
  .attachment-card-responsive.attachment-card-wide {
    grid-template-columns: 1fr;
  }
  .attachment-card-responsive .attachment-icon,
  .attachment-card-responsive.attachment-card-wide .attachment-icon {
    width: 100%;
    max-width: 104px;
    height: 72px;
  }
  .attachment-card-responsive .button-row,
  .panel .button-row.compact-row {
    justify-content: flex-start;
  }
  .chat-header-tools {
    width: 100%;
  }
  .chat-header-tools .button,
  .chat-title-form .button,
  .chat-actions-stack,
  .chat-actions-cluster {
    width: 100%;
  }
  .chat-title-form {
    grid-template-columns: 1fr;
  }
  .ai-input-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .hero.compact-hero .hero-main,
  .hero.compact-hero .hero-side-panel,
  .panel.panel-elevated,
  .field-card {
    min-width: 0;
  }
  .hero.compact-hero .hero-chip-row,
  .hero.compact-hero .hero-actions,
  .button-row.compact-row.wrap-gap {
    gap: 6px;
  }
  .table-shell table,
  .mapping-table-wrap table,
  .data-table,
  .version-table {
    width: max(100%, 560px);
  }
}

/* ===== AI CHAT LAYOUT (moved from template inline styles) ===== */
.ai-chat-hero {
  grid-template-columns: minmax(0, 1.24fr) minmax(280px, 360px);
  align-items: start;
}
.ai-chat-hero .hero-side-panel {
  max-width: 360px;
  margin-left: auto;
}
.ai-config-stack {
  display: grid;
  gap: 10px;
}
.ai-config-stack .download-tile {
  padding: 11px 13px;
  border-radius: 15px;
}
.ai-chat-layout-history {
  grid-template-columns: minmax(340px, 440px) minmax(0, 1fr);
  gap: 20px;
}
.ai-chat-layout-history .compact-scroll-box {
  max-height: 500px;
  padding-right: 6px;
}
.attachment-card-body-only.ai-session-card,
.attachment-card-body-only.ai-nav-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  padding: 14px;
}
.attachment-card-body-only.ai-session-card .attachment-body,
.attachment-card-body-only.ai-nav-card .attachment-body {
  min-width: 0;
}
.attachment-card-body-only.ai-session-card .attachment-body strong,
.attachment-card-body-only.ai-nav-card .attachment-body strong {
  display: block;
  font-size: clamp(15px, 1vw, 17px);
  line-height: 1.3;
  overflow-wrap: anywhere;
}
.attachment-card-body-only.ai-session-card .muted,
.attachment-card-body-only.ai-nav-card .muted {
  line-height: 1.5;
  overflow-wrap: anywhere;
}
.ai-chat-layout-history .button-row.compact-row {
  justify-content: flex-start;
  flex-wrap: wrap;
}
.compact-inline-form.chat-title-form {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.compact-inline-form.chat-title-form input[type="text"] {
  flex: 1 1 340px;
  min-width: 260px;
}
.ai-mode-help {
  display: grid;
  gap: 10px;
  overflow: visible;
}
.ai-mode-help-note {
  font-size: 12px;
  color: var(--muted);
}
.ai-mode-help-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  overflow: visible;
}
.mode-help-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 10px;
  border-radius: 999px;
  background: #f3f8fc;
  border: 1px solid #d8e6f2;
  color: #18324a;
  font-size: 12px;
  font-weight: 700;
  cursor: help;
}
.mode-help-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #dfeaf5;
  color: var(--primary);
  font-size: 11px;
  font-weight: 800;
}
.mode-help-chip::after {
  content: attr(data-tooltip);
  position: absolute;
  left: 0;
  top: calc(100% + 10px);
  transform: translateY(4px);
  min-width: 220px;
  max-width: 340px;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(14, 25, 38, 0.96);
  color: rgba(255,255,255,.96);
  font-size: 12px;
  font-weight: 500;
  line-height: 1.45;
  box-shadow: 0 14px 28px rgba(6, 18, 31, 0.24);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
  z-index: 80;
  white-space: normal;
  overflow-wrap: anywhere;
}
.mode-help-chip:hover::after,
.mode-help-chip:focus-visible::after {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.ai-dialog-sessions-panel {
  overflow: visible;
  z-index: 6;
}
.ai-dialog-sessions-panel::before {
  border-radius: inherit;
}
.ai-dialog-sessions-panel .compact-form-block,
.ai-dialog-sessions-panel .ai-mode-help,
.ai-dialog-sessions-panel .ai-mode-help-grid {
  overflow: visible;
}
.chat-panel-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
  gap: 14px;
  align-items: start;
}
.chat-header-actions {
  display: grid;
  justify-items: end;
  gap: 10px;
  width: 100%;
}
.chat-actions-stack {
  display: grid;
  gap: 8px;
  width: min(100%, 460px);
}
.chat-title-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  width: 100%;
}
.chat-title-form input[type="text"] {
  min-width: 0;
  width: 100%;
}
.chat-header-tools {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 8px;
}
.chat-header-meta {
  display: grid;
  gap: 6px;
}
.chat-actions-cluster {
  display: grid;
  gap: 8px;
  width: min(100%, 460px);
  justify-items: stretch;
}
.chat-header-tools form {
  margin: 0;
}
.chat-header-tools .button {
  min-width: 0;
}
.ai-message-attachments {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}
.ai-attachment-pill {
  display: grid;
  gap: 2px;
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid #d8e6f2;
  background: #f6fbff;
  min-width: 0;
  max-width: 240px;
}
.ai-attachment-pill strong {
  font-size: 12px;
  line-height: 1.35;
  overflow-wrap: anywhere;
}
.ai-attachment-pill small {
  color: #5f7488;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.ai-input-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(200px, 280px);
  gap: 10px;
}
.draft-helper-card {
  display: grid;
  gap: 12px;
}
.draft-helper-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.draft-helper-chip {
  display: grid;
  gap: 5px;
  padding: 11px 12px;
  border-radius: 14px;
  border: 1px solid #d6e4f0;
  background: #f7fbff;
  color: #18324a;
  text-align: left;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease;
}
.draft-helper-chip:hover,
.draft-helper-chip:focus-visible {
  transform: translateY(-1px);
  border-color: #b8d1e5;
  background: #eef7fd;
  box-shadow: 0 12px 22px rgba(15, 63, 102, 0.08);
}
.draft-helper-chip strong {
  font-size: 14px;
  line-height: 1.28;
}
.draft-helper-chip small {
  color: #5f7488;
  line-height: 1.45;
}
.draft-helper-chip .chip-meta {
  display: inline-flex;
  gap: 8px;
  flex-wrap: wrap;
}
.draft-helper-chip .mini-chip {
  display: inline-flex;
  align-items: center;
  padding: 4px 8px;
  border-radius: 999px;
  background: #e5f0f8;
  color: #1b4e7a;
  font-size: 11px;
  font-weight: 700;
}
.draft-helper-note {
  font-size: 12px;
  color: var(--muted);
}
.ai-tool-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.tool-choice-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  border-radius: 999px;
  border: 1px solid #d6e4f0;
  background: #f6fbff;
  color: #173047;
  cursor: pointer;
  font-size: 12px;
  font-weight: 700;
}
.tool-choice-chip input {
  margin: 0;
  accent-color: #2c75b2;
}
.tool-choice-chip:hover {
  border-color: #b9d3e7;
  background: #eef7fd;
}
.tool-choice-chip input:checked + span {
  color: #0f4f88;
}
.tool-summary-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 11px;
  border-radius: 999px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.92);
  font-size: 13px;
}
.chat-composer-status {
  display: none;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(17, 91, 160, 0.18);
  background: rgba(16, 95, 166, 0.06);
  color: #184164;
  font-size: 13px;
  font-weight: 600;
}
.chat-composer-status.is-visible {
  display: flex;
}
.action-runner-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.action-runner-card {
  display: grid;
  gap: 6px;
  padding: 12px;
  border-radius: 14px;
  border: 1px solid #d9e7f2;
  background: linear-gradient(180deg, #fbfdff 0%, #f4f9fd 100%);
  text-align: left;
  cursor: pointer;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.action-runner-card:hover,
.action-runner-card:focus-visible {
  transform: translateY(-1px);
  border-color: #bed6e7;
  box-shadow: 0 14px 24px rgba(18, 67, 104, 0.08);
}
.action-runner-card strong {
  font-size: 14px;
  line-height: 1.28;
}
.action-runner-card small {
  color: #607486;
  line-height: 1.45;
}
.action-confirm-panel {
  display: none;
  gap: 10px;
  padding: 12px 13px;
  border-radius: 14px;
  border: 1px solid #dbe7f1;
  background: #f8fbfe;
}
.action-confirm-panel.is-visible {
  display: grid;
}
.action-confirm-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.action-confirm-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.ai-result-card {
  display: grid;
  gap: 11px;
  margin-top: 6px;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid #d9e8f3;
  background: linear-gradient(180deg, #fbfdff 0%, #f5faff 100%);
  box-shadow: 0 14px 28px rgba(15, 63, 102, 0.08);
}
.ai-result-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.ai-result-card-header h3 {
  margin: 0;
  font-size: clamp(16px, 1.15vw, 19px);
  line-height: 1.22;
}
.ai-result-summary {
  color: #16324a;
  line-height: 1.58;
  font-size: 14px;
}
.ai-result-section-grid {
  display: grid;
  gap: 12px;
}
.ai-result-section {
  padding: 11px 12px;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid #e2edf5;
}
.ai-result-section h4 {
  margin: 0 0 6px;
  font-size: 13px;
  color: #1c4d75;
}
.ai-result-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ai-result-plain {
  display: none;
}
.chat-bubble.assistant.has-result-card .chat-bubble-body {
  display: none;
}
.chat-loading-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2c75b2;
  box-shadow: 14px 0 0 rgba(44, 117, 178, 0.45), 28px 0 0 rgba(44, 117, 178, 0.25);
  animation: aiPulse 1s infinite ease-in-out;
}
@keyframes aiPulse {
  0%, 100% { transform: translateY(0); opacity: 0.7; }
  50% { transform: translateY(-2px); opacity: 1; }
}
@media (max-width: 1280px) {
  .ai-chat-hero,
  .ai-chat-layout-history {
    grid-template-columns: 1fr;
  }
  .ai-chat-hero .hero-side-panel {
    max-width: none;
  }
}
@media (max-width: 980px) {
  .chat-panel-header {
    grid-template-columns: 1fr;
  }
  .chat-header-actions {
    justify-items: stretch;
  }
  .chat-actions-stack {
    width: 100%;
  }
  .chat-header-tools {
    justify-content: flex-start;
  }
}
@media (max-width: 760px) {
  .chat-title-form {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .attachment-card-body-only.ai-session-card,
  .attachment-card-body-only.ai-nav-card {
    grid-template-columns: 1fr;
  }
  .mode-help-chip::after {
    max-width: min(320px, 92vw);
  }
}

.progress[data-progress] > .progress-fill {
  width: var(--progress-width, 0%);
}

.json-meta-pre {
  margin-top: 10px;
}

.section-prompt-copy-button {
  margin-left: auto;
}

/* Stage 19G: component unification for hubs, registries and record cards */
.registry-hero {
  gap: 24px;
}
.registry-hero .hero-main,
.hub-hero .hero-main {
  gap: 14px;
}
.registry-hero .hero-chip-row,
.hub-hero .hero-chip-row {
  gap: 8px;
}
.registry-filters-panel {
  padding: 18px;
}
.registry-filters-panel .embedded-form {
  gap: 10px;
}
.registry-results-panel .panel-header {
  align-items: flex-start;
  gap: 10px;
}

.hub-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.hub-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 12px;
  padding: 14px 16px;
  border-radius: 16px;
}
.hub-card > div {
  min-width: 0;
}
.hub-card strong {
  display: block;
  margin-bottom: 4px;
  overflow-wrap: anywhere;
}
.hub-card .muted-light {
  max-width: none;
  overflow-wrap: anywhere;
}
.hub-card .chip {
  align-self: start;
}

.record-card {
  gap: 12px;
  padding: 14px;
  border-radius: 16px;
}
.record-card.record-card-compact {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}
.record-card.record-card-responsive,
.record-card.record-card-body-only {
  align-items: start;
}
.record-card__body {
  display: grid;
  gap: 5px;
  min-width: 0;
}
.record-card__body > * {
  min-width: 0;
}
.record-card__body strong,
.record-card__body a {
  display: block;
  overflow-wrap: anywhere;
}
.record-card__actions {
  justify-content: flex-end;
  align-self: start;
  flex-wrap: wrap;
  gap: 8px;
}
.record-card .muted,
.record-card .muted-light,
.record-card .mini-kicker,
.record-card .hero-chip-row {
  min-width: 0;
}
.record-card .hero-chip-row {
  gap: 8px;
}
.record-card .chip,
.record-card .badge {
  max-width: 100%;
}
.chat-list .record-card {
  background: rgba(255,255,255,0.74);
}

@media (max-width: 980px) {
  .hub-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .hub-card-grid,
  .hub-card,
  .record-card.record-card-compact {
    grid-template-columns: minmax(0, 1fr);
  }

  .hub-card .chip,
  .record-card__actions {
    justify-content: flex-start;
  }

  .registry-hero,
  .hub-hero {
    gap: 18px;
  }
}


/* === Stage 19H: shell refinement, design-system finishing, checkbox + file-widget polish === */
:root {
  --topbar-height: 88px;
  --hero-padding-y: 24px;
  --hero-padding-x: 26px;
}

.topbar-wrap {
  padding: 12px 18px 0;
}
.topbar {
  border-radius: 22px;
  box-shadow: 0 24px 54px rgba(10, 25, 42, 0.16);
}
.topbar-inner {
  gap: 18px;
  padding: 14px 20px;
}
.brand-group,
.topbar-panel,
.topnav,
.topbar-tools,
.brand-copy {
  gap: 12px;
}
.brand-mark {
  width: 50px;
  height: 50px;
  padding: 7px;
  border-radius: 15px;
}
.brand-mark::before {
  inset: 3px;
  border-radius: 11px;
}
.brand,
.brand:hover {
  font-size: 18px;
  line-height: 1.06;
}
.brand-subtitle {
  max-width: 640px;
  font-size: 11px;
  line-height: 1.34;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.topmenu-button {
  min-width: 82px;
  padding: 10px 13px;
  border-radius: 14px;
  font-size: 14px;
}
.topmenu-dropdown {
  top: calc(100% + 8px);
  min-width: 232px;
  max-width: min(320px, calc(100vw - 24px));
  max-height: min(68vh, 720px);
  gap: 6px;
  padding: 10px;
  border-radius: 18px;
  overflow: auto;
}
.topmenu-link {
  gap: 8px;
  padding: 9px 11px;
  border-radius: 12px;
}
.topmenu-label {
  font-size: 14px;
  line-height: 1.25;
}
.topbar-tools-inline {
  gap: 10px;
}
.user-chip {
  gap: 10px;
  padding: 6px 10px 6px 6px;
  border-radius: 16px;
}
.user-avatar {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  font-size: 13px;
}
.user-name {
  font-size: 13px;
  line-height: 1.2;
}
.user-role {
  font-size: 11px;
  line-height: 1.25;
}

.hero {
  padding: var(--hero-padding-y) var(--hero-padding-x);
  border-radius: 24px;
}
.hero-grid {
  grid-template-columns: minmax(0, 1.48fr) minmax(280px, 0.82fr);
  gap: 18px;
}
.hero-main {
  gap: 11px;
}
.hero h1 {
  font-size: clamp(26px, 2.4vw, 34px);
  line-height: 1.06;
}
.hero.hero-slim h1 {
  font-size: clamp(24px, 2vw, 30px);
}
.hero-text {
  max-width: 820px;
  font-size: 14px;
  line-height: 1.5;
}
.eyebrow,
.mini-kicker,
.mini-kicker-light {
  gap: 7px;
  padding: 7px 10px;
  font-size: 11px;
}
.chip {
  min-height: 32px;
  padding: 7px 11px;
  font-size: 12px;
}
.glass-card {
  border-radius: 20px;
  padding: 16px;
}
.glass-card-large {
  padding: 18px;
}
.hero-side-panel {
  gap: 14px;
}
.hero-side-grid {
  gap: 10px;
}
.hero-side-metric {
  gap: 4px;
  padding: 10px 12px;
  border-radius: 14px;
}
.hero-side-metric strong {
  font-size: clamp(18px, 1.9vw, 22px);
}
.hero-side-metric span,
.hero-side-metric small {
  line-height: 1.3;
}

.panel,
.card {
  border-radius: 20px;
  padding: 20px;
}
.panel-header,
.page-header {
  gap: 12px;
  margin-bottom: 14px;
}
.stats-grid,
.workspace-strip,
.project-card-grid,
.section-card-grid,
.info-grid,
.showcase-grid {
  gap: 14px;
}
.stat-card {
  min-height: 114px;
  padding: 16px 18px;
  border-radius: 18px;
}
.stat-card::after {
  height: 3px;
}
.stat-label {
  margin-bottom: 9px;
  font-size: 11px;
  letter-spacing: .06em;
}
.stat-value {
  font-size: clamp(24px, 2vw, 32px);
  line-height: 1.08;
}
.stat-value.small-text {
  font-size: 17px;
  line-height: 1.28;
}
.stat-note {
  margin-top: 7px;
  font-size: 12px;
  line-height: 1.35;
}
.workspace-card {
  gap: 10px;
  padding: 14px 15px;
  border-radius: 16px;
}
.workspace-card h3 {
  font-size: 16px;
  line-height: 1.22;
}
.workspace-icon {
  min-width: 40px;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  font-size: 12px;
}
.project-card,
.section-card,
.attachment-card,
.attention-item,
.showcase-card,
.info-tile,
.empty-state {
  border-radius: 18px;
}
.project-card,
.section-card,
.attachment-card,
.attention-item,
.showcase-card {
  padding: 15px;
}

.info-tile {
  min-height: 66px;
  gap: 6px;
  padding: 11px 12px;
  align-content: start;
}
.info-tile span {
  font-size: 12px;
  line-height: 1.3;
}
.info-tile strong {
  font-size: clamp(17px, 1.5vw, 22px);
  line-height: 1.18;
}
.info-tile-textual,
.info-tile-tall,
.info-tile-rich {
  align-items: start;
}
.passport-grid .info-tile,
.section-card .info-tile {
  min-height: 0;
}
.passport-grid .info-tile strong,
.section-card .info-tile strong {
  font-size: clamp(16px, 1.45vw, 21px);
  white-space: normal;
}

input[type="checkbox"],
input.checkbox-field[type="checkbox"] {
  width: 17px;
  height: 17px;
  border-radius: 5px;
  border-width: 1px;
  border-color: #8ea8bf;
  background: linear-gradient(180deg, #ffffff 0%, #f4f8fc 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 1px 2px rgba(16, 33, 50, 0.08);
}
input[type="checkbox"]::before,
input.checkbox-field[type="checkbox"]::before {
  width: 9px;
  height: 9px;
}
input[type="checkbox"]:hover,
input.checkbox-field[type="checkbox"]:hover {
  border-color: #6f91b0;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 0 0 3px rgba(15, 76, 129, 0.08);
}
input[type="checkbox"]:checked,
input.checkbox-field[type="checkbox"]:checked {
  box-shadow: 0 0 0 3px rgba(15, 76, 129, 0.10);
}
.checkbox-inline,
.compact-field-checkbox label,
.compact-file-widget__clear,
.checkbox-card {
  gap: 8px;
  line-height: 1.3;
}
.compact-field-checkbox {
  align-items: flex-start;
}
.compact-field-checkbox label {
  width: 100%;
  justify-content: flex-start;
}
.checkbox-card {
  align-items: flex-start;
}
.checkbox-card input {
  flex: 0 0 auto;
  margin-top: 1px;
}

.compact-file-widget {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px 12px;
  padding: 12px;
  border-radius: 16px;
  background: linear-gradient(180deg, rgba(255,255,255,.9) 0%, rgba(247,250,253,.96) 100%);
  border-color: #d7e4ef;
}
.compact-file-widget--image {
  grid-template-columns: 56px minmax(0, 1fr) auto;
}
.compact-file-widget__preview {
  display: inline-flex;
  width: 56px;
  height: 56px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid #d7e4ef;
  background: #eef4f9;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.72);
}
.compact-file-widget__preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.compact-file-widget__current {
  gap: 3px;
}
.compact-file-widget__current-row {
  gap: 7px;
}
.compact-file-widget__label,
.compact-file-widget__upload-label,
.compact-file-widget__clear {
  font-size: 11px;
  letter-spacing: .07em;
}
.compact-file-widget__link {
  font-size: 13px;
  line-height: 1.35;
}
.compact-file-widget__actions {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.compact-file-widget__clear {
  align-self: center;
}
.compact-file-widget__upload {
  grid-column: 1 / -1;
  gap: 5px;
}
.embedded-form-wide .compact-file-widget__upload input[type="file"],
.compact-file-widget__upload input[type="file"] {
  border-radius: 12px;
  padding: 9px 11px;
}

@media (max-width: 1180px) {
  .topbar-inner {
    flex-wrap: wrap;
    align-items: flex-start;
  }
  .topbar-panel {
    width: 100%;
  }
  .topbar-tools-inline {
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .brand-subtitle {
    max-width: 100%;
  }
}

@media (max-width: 980px) {
  .topbar-wrap {
    padding: 10px 12px 0;
  }
  .topbar {
    border-radius: 18px;
  }
  .topbar-inner {
    padding: 12px 14px;
  }
  .hero {
    padding: 20px 18px;
    border-radius: 20px;
  }
  .hero-grid {
    grid-template-columns: 1fr;
  }
  .glass-card,
  .glass-card-large {
    padding: 14px;
  }
  .stat-card {
    min-height: 0;
  }
}

@media (max-width: 760px) {
  .brand {
    font-size: 16px;
  }
  .brand-subtitle {
    display: none;
  }
  .topmenu-button {
    min-width: 0;
    width: 100%;
  }
  .topbar-tools-inline {
    align-items: stretch;
  }
  .topbar-tools-inline .user-chip {
    margin-left: 0;
    width: 100%;
  }
  .compact-file-widget,
  .compact-file-widget--image {
    grid-template-columns: 1fr;
  }
  .compact-file-widget__preview {
    width: 64px;
    height: 64px;
  }
  .compact-file-widget__clear {
    align-self: flex-start;
  }
}


/* ===== Stage 19I: targeted layout fixes for AI fill, AI files and project overview rail ===== */
.ai-fill-grid {
  grid-template-columns: minmax(0, 1.7fr) minmax(320px, 0.95fr);
  gap: 22px;
}
.ai-fill-suggestion-card {
  display: grid;
  gap: 14px;
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, 0.09);
  background: rgba(255, 255, 255, 0.74);
}
.ai-fill-suggestion-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  align-items: start;
}
.ai-fill-suggestion-title strong {
  overflow-wrap: normal;
  word-break: normal;
}
.ai-fill-suggestion-meta {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  min-width: 0;
}
.ai-fill-rationale {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(59, 130, 246, 0.14);
  background: rgba(239, 246, 255, 0.72);
}
.ai-fill-diff-wide {
  gap: 14px;
}
.ai-fill-diff-wide article {
  min-height: 100%;
}
.ai-fill-source-card {
  align-items: start;
}
.ai-fill-source-card .record-card__body strong,
.ai-fill-source-card .record-card__body div,
.ai-fill-source-card .record-card__body .muted {
  overflow-wrap: normal;
  word-break: normal;
}
.ai-fill-toolbar-suggestion {
  justify-content: flex-start;
  padding-top: 2px;
}
.artifact-record-card {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
  padding: 16px 18px;
  border-radius: 18px;
  border: 1px solid rgba(15, 23, 42, 0.09);
  background: rgba(255,255,255,0.74);
}
.artifact-record-format {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 72px;
  padding: 10px 12px;
  border-radius: 18px;
  background: rgba(232, 240, 248, 0.96);
  border: 1px solid rgba(59, 130, 246, 0.14);
  color: var(--brand);
  font-weight: 800;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .08em;
  text-align: center;
}
.artifact-record-main {
  display: grid;
  gap: 8px;
}
.artifact-record-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
}
.artifact-record-head strong,
.artifact-record-description,
.artifact-record-meta {
  overflow-wrap: normal;
  word-break: normal;
}
.artifact-record-chips {
  justify-content: flex-end;
}
.artifact-record-actions {
  justify-content: flex-end;
  align-self: start;
}
.hub-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}
.hub-module-card {
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  min-height: 108px;
  align-content: space-between;
}
.hub-module-card .muted-light {
  line-height: 1.45;
}
.hub-module-card__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.hub-module-card__action {
  color: var(--brand);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .02em;
}
.project-overview-layout-wide {
  grid-template-columns: minmax(0, 1.42fr) minmax(360px, 1.02fr);
}
.accordion-surface {
  overflow: hidden;
}
.accordion-summary,
.accordion-inline-summary {
  list-style: none;
}
.accordion-summary::-webkit-details-marker,
.accordion-inline-summary::-webkit-details-marker {
  display: none;
}
.accordion-summary-icon {
  width: 11px;
  height: 11px;
  border-right: 2px solid rgba(24, 50, 74, 0.58);
  border-bottom: 2px solid rgba(24, 50, 74, 0.58);
  transform: rotate(-45deg);
  transition: transform .18s ease, border-color .18s ease;
  flex: 0 0 auto;
  margin-top: 2px;
}
.accordion-surface[open] .accordion-summary-icon,
.accordion-inline[open] .accordion-summary-icon {
  transform: rotate(45deg);
  border-color: rgba(15, 95, 164, 0.78);
}
.accordion-summary-surface {
  display: grid;
  background: rgba(255,255,255,0.02);
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 14px;
  align-items: center;
  padding: 14px 18px;
  cursor: pointer;
}
.accordion-summary-main h2,
.accordion-summary-main .muted,
.accordion-summary-main .mini-kicker {
  margin: 0;
}
.accordion-summary-main {
  display: grid;
  gap: 4px;
  min-width: 0;
}
.accordion-summary-main h2 {
  font-size: clamp(18px, 2vw, 22px);
  line-height: 1.18;
}
.accordion-summary-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
}
.summary-chip {
  display: inline-flex;
  align-items: center;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(228, 237, 246, 0.92);
  border: 1px solid rgba(173, 197, 221, 0.95);
  color: #1e4f80;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}
.accordion-summary-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 92px;
  padding: 8px 12px;
  border-radius: 12px;
  border: 1px solid rgba(173, 197, 221, 0.95);
  background: rgba(255, 255, 255, 0.86);
  color: var(--brand);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .01em;
}
.accordion-summary-action .accordion-close-label {
  display: none;
}
.accordion-summary-surface:hover,
.accordion-inline-summary:hover {
  background: rgba(244, 248, 252, 0.9);
}
.accordion-surface[open] .accordion-summary-action .accordion-open-label {
  display: none;
}
.accordion-surface[open] .accordion-summary-action .accordion-close-label {
  display: inline;
}
.project-structure-disclosure {
  width: min(100%, 760px);
}
.project-structure-toolbar {
  margin-top: 6px;
  border: 1px solid rgba(207, 220, 234, 0.96);
  border-radius: 16px;
  background: rgba(252, 253, 255, 0.96);
  box-shadow: 0 10px 28px rgba(18, 42, 70, 0.06);
  overflow: hidden;
}
.project-structure-toolbar-summary {
  display: grid;
  grid-template-columns: auto auto auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  cursor: pointer;
  list-style: none;
}
.project-structure-toolbar-summary::-webkit-details-marker {
  display: none;
}
.project-structure-toolbar-icon {
  margin-right: 0;
}
.project-structure-toolbar-kicker {
  margin: 0;
  white-space: nowrap;
}
.project-structure-toolbar-title {
  color: var(--text);
  font-size: 15px;
  line-height: 1.2;
  white-space: nowrap;
}
.project-structure-summary,
.project-structure-summary-minimal,
.project-structure-summary-line {
  all: unset;
}
.project-structure-inline-summary {
  min-width: 0;
  color: var(--muted-strong);
  font-size: 13px;
  line-height: 1.35;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.project-structure-toolbar-summary-text {
  display: block;
}
.project-structure-toggle {
  min-width: 0;
  padding: 6px 10px;
}
.project-structure-body {
  display: grid;
  gap: 8px;
  padding-top: 0;
}
.project-structure-toolbar-body {
  padding: 0 14px 12px;
}
.disclosure-body-compact {
  padding: 0 18px 16px;
}
.disclosure-inline-note {
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(244, 248, 252, 0.92);
  border: 1px solid rgba(211, 224, 237, 0.95);
  color: var(--muted-strong);
  font-size: 13px;
  line-height: 1.5;
}
.disclosure-actions-row {
  margin-top: 0;
}
.accordion-inline {
  margin-top: 10px;
  border: 1px solid rgba(207, 220, 234, 0.96);
  border-radius: 16px;
  background: rgba(252, 253, 255, 0.96);
  overflow: hidden;
}
.accordion-inline-summary {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  cursor: pointer;
}
.accordion-inline-text {
  display: grid;
  gap: 2px;
  min-width: 0;
}
.accordion-inline-text strong {
  color: var(--text);
  font-size: 14px;
  line-height: 1.25;
}
.accordion-inline-text small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.35;
}
.accordion-inline-meta {
  display: inline-flex;
  align-items: center;
  padding: 7px 10px;
  border-radius: 999px;
  background: rgba(234, 241, 248, 0.9);
  border: 1px solid rgba(201, 216, 232, 0.95);
  color: #234f79;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
}
.accordion-inline .route-list,
.accordion-inline .timeline {
  padding: 0 14px 14px;
  margin: 0;
}
.accordion-inline .route-list {
  border-top: 1px solid rgba(220, 231, 240, 0.92);
  padding-top: 12px;
}
.accordion-inline .timeline {
  border-top: 1px solid rgba(220, 231, 240, 0.92);
  padding-top: 12px;
}
.accordion-inline-toolbar {
  margin-top: 8px;
  border-radius: 14px;
}
.accordion-inline-toolbar .accordion-inline-summary {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 10px;
  padding: 9px 12px;
}
.accordion-inline-toolbar .accordion-inline-text {
  gap: 1px;
}
.accordion-inline-toolbar .accordion-inline-text strong {
  font-size: 13px;
}
.accordion-inline-toolbar .accordion-inline-text small {
  font-size: 11px;
  line-height: 1.3;
}
.accordion-inline-toolbar .accordion-inline-meta {
  padding: 6px 9px;
  font-size: 11px;
}
.accordion-inline-action {
  padding: 5px 9px;
  font-size: 11px;
  white-space: nowrap;
}
.accordion-inline-toolbar .route-list,
.accordion-inline-toolbar .timeline {
  padding-left: 12px;
  padding-right: 12px;
  padding-bottom: 12px;
}
.accordion-inline-toolbar .route-list,
.accordion-inline-toolbar .timeline {
  padding-top: 10px;
}

.accordion-inline[open] .accordion-summary-action .accordion-open-label {
  display: none;
}
.accordion-inline[open] .accordion-summary-action .accordion-close-label {
  display: inline;
}
.accordion-inline .accordion-summary-action .accordion-close-label {
  display: none;
}
.dashboard-disclosure-toolbar,
.report-pack-toolbar {
  margin-top: 10px;
  border-radius: 14px;
  background: rgba(252, 253, 255, 0.96);
  border: 1px solid rgba(207, 220, 234, 0.96);
  box-shadow: 0 8px 18px rgba(18, 42, 70, 0.05);
}
.dashboard-toolbar-summary,
.report-pack-toolbar-summary {
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 10px;
  padding: 9px 12px;
}
.dashboard-toolbar-summary .accordion-inline-text strong,
.report-pack-toolbar-summary .accordion-inline-text strong {
  font-size: 13px;
}
.dashboard-toolbar-summary .accordion-inline-text small,
.report-pack-toolbar-summary .accordion-inline-text small {
  font-size: 11px;
  line-height: 1.3;
}
.dashboard-toolbar-summary .accordion-inline-meta,
.report-pack-toolbar-summary .accordion-inline-meta {
  padding: 6px 9px;
  font-size: 11px;
}
.dashboard-disclosure-toolbar .prompt-bank-body,
.report-pack-toolbar .prompt-bank-body {
  padding: 0 12px 12px;
  gap: 10px;
}
.dashboard-disclosure-toolbar .stats-grid {
  gap: 10px;
}
.dashboard-disclosure-toolbar .stat-card {
  min-height: 0;
  padding: 14px 16px;
}
.dashboard-disclosure-toolbar .attention-scroll {
  max-height: 460px;
}
.report-pack-toolbar .route-list {
  padding-left: 12px;
  padding-right: 12px;
  padding-bottom: 12px;
  padding-top: 10px;
}
@media (max-width: 760px) {
  .dashboard-toolbar-summary,
  .report-pack-toolbar-summary {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }
  .dashboard-toolbar-summary .accordion-summary-action,
  .report-pack-toolbar-summary .accordion-summary-action {
    grid-column: 2 / -1;
    justify-self: start;
  }
}

.prompt-disclosure-toolbar {
  margin-top: 10px;
  border-radius: 14px;
  background: rgba(252, 253, 255, 0.96);
  border: 1px solid rgba(207, 220, 234, 0.96);
}
.prompt-disclosure-summary-toolbar {
  padding: 10px 12px;
  gap: 10px;
}
.prompt-disclosure-summary-text {
  display: grid;
  gap: 1px;
  min-width: 0;
}
.prompt-disclosure-summary-text strong {
  font-size: 13px;
  line-height: 1.25;
}
.prompt-disclosure-summary-text small {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.3;
}
.prompt-disclosure-summary-meta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.prompt-disclosure-toolbar .prompt-switcher,
.prompt-disclosure-toolbar .empty-state {
  padding: 0 12px 12px;
}
.project-tabs-panel {
  padding: 8px;
}
.project-tabs {
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 6px;
}
.project-tab {
  padding: 10px 12px;
  border-radius: 14px;
}
.project-tab-title {
  font-size: 13px;
}
.project-tab-note {
  font-size: 10px;
  line-height: 1.25;
}
.compact-status-panel .panel-header {
  margin-bottom: 8px;
}
.compact-stage-summary-grid {
  gap: 10px;
}
.compact-status-panel .info-tile {
  min-height: 0;
  padding: 14px 16px;
}
.compact-status-panel .info-tile-textual .info-tile-text,
.compact-status-panel .info-tile-textual .info-tile-content,
.compact-status-panel .info-tile-textual strong {
  font-size: clamp(13px, 1.02vw, 16px);
  line-height: 1.45;
}
.compact-stage-form {
  display: grid;
  gap: 12px;
}
.compact-stage-form .field-card {
  padding: 12px 14px;
}
.compact-stage-form textarea {
  min-height: 96px;
}
.compact-status-panel .button {
  min-width: 0;
}
.project-ai-materials-grid {
  display: grid;
  gap: 14px;
}
.project-ai-materials-panel .field-grid.two-col-tight {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.project-ai-mini-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: start;
}
.project-ai-mini-card strong,
.project-ai-mini-card .muted-light {
  overflow-wrap: normal;
  word-break: normal;
}
.project-ai-mini-card .badge {
  white-space: nowrap;
  align-self: start;
}

@media (max-width: 1100px) {
  .accordion-summary-surface {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .accordion-summary-meta,
  .accordion-summary-action {
    grid-column: 2;
    justify-content: flex-start;
  }
  .project-structure-disclosure {
    width: 100%;
  }
  .project-structure-toolbar-summary {
    grid-template-columns: auto auto minmax(0, 1fr) auto;
  }
  .project-structure-toolbar-title {
    white-space: normal;
  }
  .project-structure-inline-summary {
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }
}
@media (max-width: 760px) {
  .accordion-inline-summary {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .accordion-inline-meta {
    grid-column: 2;
    justify-self: start;
  }
  .accordion-summary-surface {
    padding: 12px 14px;
    gap: 12px;
  }
  .project-structure-toolbar-summary {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 8px;
  }
  .project-structure-toolbar-kicker,
  .project-structure-toolbar-title {
    grid-column: 2;
  }
  .project-structure-inline-summary {
    grid-column: 2;
  }
  .project-structure-toggle {
    grid-column: 3;
    justify-self: end;
  }
  .disclosure-body-compact {
    padding: 0 14px 14px;
  }
}
@media (max-width: 1200px) {
  .artifact-record-card {
    grid-template-columns: 72px minmax(0, 1fr);
  }
  .artifact-record-actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
  .artifact-record-head {
    grid-template-columns: 1fr;
  }
  .artifact-record-chips {
    justify-content: flex-start;
  }
}
@media (max-width: 980px) {
  .project-tabs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .project-overview-layout-wide,
  .ai-fill-grid {
    grid-template-columns: 1fr;
  }
  .ai-fill-suggestion-head,
  .artifact-record-card,
  .project-ai-mini-card {
    grid-template-columns: 1fr;
  }
  .ai-fill-suggestion-meta,
  .artifact-record-actions,
  .project-ai-mini-card .badge,
  .project-ai-mini-card .record-card__actions {
    justify-self: start;
    align-items: flex-start;
  }
  .project-ai-materials-panel .field-grid.two-col-tight {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 760px) {
  .hub-card-grid {
    grid-template-columns: 1fr;
  }
  .artifact-record-format {
    min-height: 56px;
  }
}
@media (max-width: 640px) {
  .project-tabs {
    grid-template-columns: 1fr;
  }
  .ai-fill-diff-wide {
    grid-template-columns: 1fr;
  }
}


/* --- UI polish 19K: AI center restore + compact heavy side panels --- */
.compact-side-panel {
  max-width: 372px;
  padding: 14px;
  gap: 10px;
  border-radius: 18px;
}
.compact-side-panel .glass-card-header h3 {
  margin-top: 2px;
  font-size: 15px;
  line-height: 1.3;
}
.compact-side-panel .stack-list,
.compact-side-panel .ai-config-stack,
.compact-side-panel .ai-config-stack-compact {
  gap: 8px;
}
.compact-side-panel .download-tile {
  padding: 12px 14px;
  border-radius: 16px;
}
.compact-side-panel .download-tile strong {
  font-size: 13px;
  line-height: 1.3;
}
.compact-side-panel .download-tile small {
  margin-top: 4px;
  font-size: 12px;
  line-height: 1.45;
}
.compact-side-panel .button-row {
  gap: 8px;
}
.compact-side-panel .button,
.compact-filter-panel .button {
  min-height: 40px;
  padding: 9px 14px;
}
.compact-filter-panel .embedded-form {
  gap: 8px;
}
.compact-filter-panel .field-card.compact-field {
  padding: 12px;
  border-radius: 14px;
}
.compact-filter-panel .field-card.compact-field label {
  margin-bottom: 6px;
  font-size: 13px;
}
.compact-filter-panel input,
.compact-filter-panel select,
.compact-filter-panel textarea {
  min-height: 40px;
}
.registry-hero .hero-main,
.hub-hero .hero-main {
  gap: 12px;
}
.registry-hero .hero-chip-row,
.hub-hero .hero-chip-row {
  gap: 7px;
}
.hero.compact-hero.hero-grid {
  grid-template-columns: minmax(0, 1fr) minmax(300px, 372px);
}
.hero.compact-hero .hero-actions.compact-row {
  gap: 8px;
}
.hero.compact-hero .hero-actions.compact-row .button {
  min-height: 40px;
  padding: 9px 14px;
}
@media (max-width: 1180px) {
  .hero.compact-hero.hero-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .compact-side-panel {
    max-width: none;
  }
}


/* --- UI polish 19L: global compact-hero squeeze --- */
.hero.compact-hero {
  padding: 18px 20px;
  border-radius: 20px;
}
.hero.compact-hero.hero-grid {
  grid-template-columns: minmax(0, 1fr) minmax(248px, 332px);
  gap: 14px;
  align-items: start;
}
.hero.compact-hero .hero-main {
  align-content: start;
  gap: 9px;
}
.hero.compact-hero h1 {
  font-size: clamp(21px, 2vw, 30px);
  line-height: 1.08;
}
.hero.compact-hero .hero-text,
.hero.compact-hero p {
  max-width: 760px;
  font-size: 13px;
  line-height: 1.42;
}
.hero.compact-hero .hero-kicker,
.hero.compact-hero .eyebrow,
.hero.compact-hero .mini-kicker,
.hero.compact-hero .mini-kicker-light {
  gap: 6px;
  padding: 5px 9px;
  font-size: 11px;
}
.hero.compact-hero .hero-chip-row,
.hero.compact-hero .hero-actions {
  gap: 6px;
  row-gap: 6px;
}
.hero.compact-hero .chip,
.hero.compact-hero .badge {
  min-height: 28px;
  padding: 5px 9px;
  font-size: 11px;
}
.hero.compact-hero .button {
  min-height: 36px;
  padding: 8px 12px;
}
.hero.compact-hero .hero-side-panel,
.hero.compact-hero .ai-side-panel-tight,
.hero.compact-hero .compact-side-panel {
  max-width: 332px;
  padding: 12px;
  gap: 8px;
  border-radius: 16px;
}
.hero.compact-hero .glass-card-header {
  gap: 8px;
}
.hero.compact-hero .glass-card-header h3 {
  font-size: 15px;
  line-height: 1.25;
}
.hero.compact-hero .hero-side-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.hero.compact-hero .hero-side-metric {
  min-height: 0;
  gap: 3px;
  padding: 8px 10px;
  border-radius: 12px;
}
.hero.compact-hero .hero-side-metric strong {
  font-size: clamp(16px, 1.4vw, 20px);
  line-height: 1.1;
}
.hero.compact-hero .hero-side-metric span,
.hero.compact-hero .hero-side-metric small {
  font-size: 11px;
  line-height: 1.25;
}
.hero.compact-hero .download-tile {
  padding: 10px 12px;
  border-radius: 14px;
}
.hero.compact-hero .download-tile strong {
  font-size: 13px;
  line-height: 1.25;
}
.hero.compact-hero .download-tile small {
  margin-top: 3px;
  font-size: 11px;
  line-height: 1.35;
}
.hero.compact-hero .embedded-form {
  gap: 8px;
}
.hero.compact-hero .field-card.compact-field {
  padding: 10px;
  border-radius: 12px;
}
.hero.compact-hero .field-card.compact-field label {
  margin-bottom: 5px;
  font-size: 12px;
}
.hero.compact-hero input,
.hero.compact-hero select,
.hero.compact-hero textarea {
  min-height: 38px;
}
.registry-hero .hero-main,
.hub-hero .hero-main {
  gap: 10px;
}
.registry-hero .hero-chip-row,
.hub-hero .hero-chip-row {
  gap: 6px;
}
@media (max-width: 1280px) {
  .hero.compact-hero.hero-grid {
    grid-template-columns: minmax(0, 1fr) minmax(232px, 308px);
  }
  .hero.compact-hero .hero-side-panel,
  .hero.compact-hero .ai-side-panel-tight,
  .hero.compact-hero .compact-side-panel {
    max-width: 308px;
  }
}
@media (max-width: 1180px) {
  .hero.compact-hero {
    padding: 18px;
  }
  .hero.compact-hero.hero-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .hero.compact-hero .hero-side-panel,
  .hero.compact-hero .ai-side-panel-tight,
  .hero.compact-hero .compact-side-panel {
    max-width: none;
  }
}
@media (max-width: 760px) {
  .hero.compact-hero {
    padding: 16px;
    border-radius: 18px;
  }
  .hero.compact-hero h1 {
    font-size: clamp(20px, 7vw, 26px);
  }
  .hero.compact-hero .hero-side-grid {
    grid-template-columns: 1fr;
  }
}


/* --- UI polish 19N: compact project AI center modules --- */
.hub-card-grid-modules-tight {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.hub-module-card-tight {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  gap: 8px;
  min-height: 0;
  padding: 12px 14px;
  border-radius: 14px;
}
.hub-module-card-tight .muted-light {
  font-size: 13px;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.hub-module-card__top {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
  gap: 10px;
}
.hub-module-card__top strong {
  margin: 0;
  font-size: 14px;
  line-height: 1.25;
}
.hub-module-card__top .chip {
  justify-self: end;
  align-self: start;
  min-width: 0;
  padding: 5px 10px;
}
.hub-module-card__footer {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  margin-top: 2px;
}
.hub-module-card-tight .hub-module-card__action {
  font-size: 12px;
  letter-spacing: 0;
}
@media (max-width: 1320px) {
  .hub-card-grid-modules-tight {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 980px) {
  .hub-card-grid-modules-tight {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .hub-card-grid-modules-tight {
    grid-template-columns: 1fr;
  }
  .hub-module-card-tight {
    padding: 11px 12px;
  }
}


.project-ai-module-grid-compact {
  display: grid;
  grid-template-columns: repeat(3, minmax(240px, 1fr));
  gap: 0.75rem;
}

.project-ai-module-link {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
  min-height: 0;
  padding: 0.8rem 0.95rem;
  border: 1px solid rgba(13, 74, 128, 0.12);
  border-radius: 0.95rem;
  background: rgba(255, 255, 255, 0.72);
  color: inherit;
  text-decoration: none;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
}

.project-ai-module-link:hover {
  border-color: rgba(13, 74, 128, 0.24);
  box-shadow: 0 10px 24px rgba(15, 35, 95, 0.08);
  transform: translateY(-1px);
}

.project-ai-module-title {
  min-width: 0;
  font-weight: 800;
  font-size: 0.98rem;
  line-height: 1.2;
  color: var(--ink-strong);
  overflow-wrap: normal;
  word-break: normal;
}

.project-ai-module-meta {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}

.project-ai-module-link .chip {
  min-width: 2rem;
  justify-content: center;
  padding-inline: 0.45rem;
}

.project-ai-module-action {
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--brand-700);
  white-space: nowrap;
}

@media (max-width: 1280px) {
  .project-ai-module-grid-compact {
    grid-template-columns: repeat(2, minmax(240px, 1fr));
  }
}

@media (max-width: 760px) {
  .project-ai-module-grid-compact {
    grid-template-columns: 1fr;
  }

  .project-ai-module-link {
    padding: 0.8rem 0.9rem;
  }

  .project-ai-module-title {
    font-size: 0.95rem;
  }

  .project-ai-module-meta {
    gap: 0.45rem;
  }

  .project-ai-module-action {
    font-size: 0.78rem;
  }
}




.responsibility-summary-panel {
  border: 1px solid rgba(37, 99, 235, .12);
}
.responsibility-summary-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: 12px;
}
.responsibility-summary-grid-compact {
  grid-template-columns: 1fr;
}
.responsibility-chip-card {
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 12px 14px;
  background: rgba(248, 250, 252, .92);
  display: grid;
  gap: 6px;
}
.responsibility-chip-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
}
.responsibility-chip-card-user {
  font-weight: 600;
  color: var(--ink);
}
.responsibility-summary-footer,
.responsibility-inline-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 12px;
}
.responsibility-role-group {
  display: grid;
  gap: 10px;
}
.responsibility-role-header {
  background: rgba(15, 23, 42, .04);
}
.responsibility-assignment-list {
  display: grid;
  gap: 10px;
}
.responsibility-record-card {
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: start;
}
.responsibility-section-grid {
  display: grid;
  gap: 12px;
}
.responsibility-section-card {
  justify-content: space-between;
  align-items: start;
}
.compact-form-stack .form-layout {
  gap: 12px;
}
@media (max-width: 980px) {
  .responsibility-record-card,
  .responsibility-section-card {
    grid-template-columns: 1fr;
  }
}

/* Stage 20D: workflow integration for responsibilities, attachments, fill and one-page summary */
.workflow-panel {
  overflow: hidden;
}

.workflow-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
}

.workflow-grid-three-up {
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}

.workflow-grid-four-up {
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
}

.workflow-step-card {
  border: 1px solid rgba(148, 163, 184, 0.22);
  border-radius: 18px;
  padding: 14px 16px;
  background: rgba(255, 255, 255, 0.82);
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 0;
}

.workflow-step-card-accent {
  background: linear-gradient(180deg, rgba(239, 246, 255, 0.95), rgba(255, 255, 255, 0.9));
  border-color: rgba(59, 130, 246, 0.22);
}

.workflow-step-header {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: space-between;
  min-width: 0;
}

.workflow-step-header strong {
  font-size: 0.98rem;
  line-height: 1.25;
  min-width: 0;
  flex: 1 1 auto;
}

.workflow-step-count {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  padding: 4px 9px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.08);
  color: var(--ink);
  font-size: 0.78rem;
  font-weight: 700;
}

.workflow-step-summary {
  margin: 0;
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.45;
}

.workflow-step-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: auto;
}

.compact-workflow-panel .panel-header p {
  max-width: 78ch;
}

.project-ai-module-link {
  min-height: auto;
}

.responsibility-section-card .card-actions {
  align-items: flex-start;
}

.responsibility-role-header {
  background: rgba(248, 250, 252, 0.9);
}

.ai-fill-suggestion-head {
  gap: 14px;
}

.ai-fill-source-card .record-card__body,
.ai-fill-suggestion-card .record-card__body {
  min-width: 0;
}

.ai-fill-source-card strong,
.ai-fill-suggestion-card strong {
  overflow-wrap: anywhere;
}

@media (max-width: 1180px) {
  .workflow-grid-four-up {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  }
}

@media (max-width: 900px) {
  .workflow-grid,
  .workflow-grid-three-up,
  .workflow-grid-four-up {
    grid-template-columns: 1fr;
  }
}