html {
  font-size: 14px;
  color-scheme: dark;
  background: #0b1118;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  background: #0b1118;
  color: #e5edf5;
  margin-bottom: 60px;
}

a {
  color: #7dd3fc;
}

a:hover {
  color: #bae6fd;
}

.navbar.bg-dark {
  background: #111a24 !important;
}

.navbar .nav-link,
.navbar .navbar-brand,
.navbar .btn-link {
  color: #dbeafe !important;
}

.navbar .nav-link:hover,
.navbar .navbar-brand:hover,
.navbar .btn-link:hover {
  color: #7dd3fc !important;
}

.footer {
  background: #0f1720;
  border-color: #263647 !important;
}

.form-control,
.form-select,
.input-group-text {
  background-color: #111a24;
  border-color: #334155;
  color: #e5edf5;
}

.form-control::placeholder {
  color: #94a3b8;
}

.form-control:focus,
.form-select:focus {
  background-color: #111a24;
  border-color: #38bdf8;
  color: #f8fafc;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

.project-progress-page {
  --progress-ink: #e5edf5;
  --progress-muted: #94a3b8;
  --progress-border: #263647;
  --progress-surface: #111a24;
  color: var(--progress-ink);
  padding: 1.5rem 0 4rem;
}

.progress-hero,
.current-milestone-heading,
.section-heading,
.progress-label-row,
.milestone-row-heading,
.stage-card-topline {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

.progress-hero {
  align-items: flex-end;
  margin-bottom: 1.5rem;
}

.eyebrow {
  color: #64748b;
  display: block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .12em;
  margin-bottom: .35rem;
  text-transform: uppercase;
}

.progress-hero h1,
.current-milestone-card h2,
.section-heading h2 {
  letter-spacing: -.03em;
  margin-bottom: .35rem;
}

.progress-hero .lead {
  color: var(--progress-muted);
  font-size: 1rem;
}

.status-pill {
  border-radius: 999px;
  display: inline-flex;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .05em;
  padding: .4rem .7rem;
  text-transform: uppercase;
  white-space: nowrap;
}

.status-current {
  background: #0c4a6e;
  color: #bae6fd;
}

.status-planned {
  background: #1e293b;
  color: #cbd5e1;
}

.status-completed {
  background: #14532d;
  color: #bbf7d0;
}

.status-in_progress {
  background: #713f12;
  color: #fde68a;
}

.status-blocked {
  background: #7f1d1d;
  color: #fecaca;
}

.build-meta-grid {
  display: grid;
  gap: .75rem;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 1.5rem;
}

.build-meta-card,
.stage-card,
.current-milestone-card {
  background: #111a24;
  border: 1px solid var(--progress-border);
  border-radius: 1rem;
  box-shadow: 0 .5rem 1.5rem rgba(23, 33, 43, .04);
}

.build-meta-card {
  padding: 1rem;
}

.build-meta-card span {
  color: var(--progress-muted);
  display: block;
  font-size: .78rem;
  margin-bottom: .35rem;
}

.build-meta-card strong {
  display: block;
  font-size: .92rem;
}

.current-milestone-card {
  background: linear-gradient(135deg, #122638 0%, #111a24 65%);
  border-color: #155e75;
  margin-bottom: 2.5rem;
  padding: 1.5rem;
}

.current-milestone-card p,
.stage-card p {
  color: var(--progress-muted);
}

.current-milestone-card p {
  margin: .8rem 0 1.25rem;
  max-width: 52rem;
}

.progress-label-row {
  color: var(--progress-muted);
  font-size: .82rem;
  margin-bottom: .4rem;
}

.progress-label-row strong {
  color: var(--progress-ink);
}

.progress {
  background: #263647;
  border-radius: 999px;
  height: .7rem;
  overflow: hidden;
}

.progress-bar {
  background: linear-gradient(90deg, #0284c7, #14b8a6);
  border-radius: inherit;
}

.current-milestone-card small {
  display: block;
  margin-top: .5rem;
}

.exit-criteria {
  border-left: 3px solid #38bdf8;
  display: grid;
  gap: .2rem;
  margin-top: 1.25rem;
  padding-left: .85rem;
}

.exit-criteria span {
  color: var(--progress-muted);
  font-size: .9rem;
}

.section-heading {
  margin-bottom: 1rem;
}

.progress-summary {
  text-align: right;
}

.progress-summary strong,
.progress-summary span {
  display: block;
}

.progress-summary span {
  color: var(--progress-muted);
  font-size: .78rem;
}

.stage-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.stage-card {
  padding: 1.25rem;
}

.stage-card.is-current {
  border-color: #38bdf8;
  box-shadow: 0 .75rem 2rem rgba(2, 132, 199, .1);
}

.stage-number {
  align-items: center;
  background: #0c4a6e;
  border-radius: .75rem;
  color: #bae6fd;
  display: inline-flex;
  font-size: .9rem;
  font-weight: 800;
  height: 2rem;
  justify-content: center;
  width: 2rem;
}

.stage-card h3 {
  font-size: 1.15rem;
  margin: 1rem 0 .45rem;
}

.stage-card p {
  font-size: .9rem;
  min-height: 3.1rem;
}

.milestone-row {
  border-top: 1px solid var(--progress-border);
  margin-top: 1rem;
  padding-top: 1rem;
}

.milestone-row-heading {
  color: var(--progress-muted);
  font-size: .76rem;
  margin-bottom: .4rem;
}

.milestone-row-heading strong {
  color: var(--progress-ink);
}

.progress-small {
  height: .42rem;
}

.milestone-title {
  color: var(--progress-ink);
  display: block;
  font-size: .86rem;
  font-weight: 600;
  margin-top: .6rem;
}

.milestone-details {
  border-top: 1px dashed #334155;
  margin-top: .85rem;
  padding-top: .75rem;
}

.milestone-details summary {
  color: #bae6fd;
  cursor: pointer;
  font-size: .78rem;
  font-weight: 700;
  list-style-position: inside;
}

.task-list {
  list-style: none;
  margin: .7rem 0 0;
  padding: 0;
}

.task-item {
  align-items: flex-start;
  border-top: 1px solid rgba(51, 65, 85, .65);
  display: grid;
  gap: .55rem;
  grid-template-columns: 2.2rem minmax(0, 1fr) auto;
  padding: .65rem 0;
}

.task-marker {
  color: #94a3b8;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .78rem;
  font-weight: 800;
}

.task-completed .task-marker {
  color: #86efac;
}

.task-in_progress .task-marker {
  color: #fde68a;
}

.task-blocked .task-marker {
  color: #fca5a5;
}

.task-copy {
  color: #dbeafe;
  font-size: .78rem;
  line-height: 1.45;
}

.task-copy strong {
  color: #7dd3fc;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .72rem;
}

.task-copy small {
  color: #94a3b8;
  display: block;
  margin-top: .2rem;
}

.task-item .status-pill {
  font-size: .6rem;
  padding: .25rem .45rem;
}

.progress-footer-note {
  background: var(--progress-surface);
  border: 1px solid var(--progress-border);
  border-radius: .8rem;
  color: var(--progress-muted);
  font-size: .82rem;
  margin-top: 1.5rem;
  padding: .9rem 1rem;
}

@media (max-width: 767.98px) {
  .progress-hero,
  .current-milestone-heading,
  .section-heading {
    align-items: flex-start;
    flex-direction: column;
  }

  .build-meta-grid,
  .stage-grid {
    grid-template-columns: 1fr;
  }

  .progress-summary {
    text-align: left;
  }
}

/* Developer contribution log */
.contribution-log { margin-top: 2rem; }
.contribution-form-card,
.contribution-item {
    background: var(--bs-tertiary-bg, rgba(255,255,255,.04));
    border: 1px solid var(--bs-border-color, rgba(255,255,255,.12));
    border-radius: .75rem;
    padding: 1.25rem;
    margin-bottom: 1rem;
}
.contribution-form-card h3 { margin-bottom: 1rem; }
.contribution-item-topline {
    display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .5rem;
}
.contribution-item h4 { font-size: 1.05rem; }
.contribution-item p { margin-bottom: .5rem; }
.architecture-reason {
    background: var(--bs-warning-bg-subtle, rgba(255,193,7,.1));
    border-left: 3px solid var(--bs-warning, #ffc107);
    padding: .5rem .75rem; border-radius: .25rem; margin: .5rem 0;
}

/* Developer workspace (collaboration log) */
.developer-workspace { margin-top: 2rem; }
.developer-workspace .nav-tabs { margin: 1rem 0 .5rem; }
.tab-content { padding-top: 1rem; }
.ws-card, .task-card, .activity-card, .adr-card {
    background: var(--bs-tertiary-bg, rgba(255,255,255,.04));
    border: 1px solid var(--bs-border-color, rgba(255,255,255,.12));
    border-radius: .75rem;
    padding: 1.25rem;
    margin-bottom: 1rem;
}
.ws-card h3 { margin-bottom: .25rem; }
.chip-row { display: flex; flex-wrap: wrap; gap: .5rem; }
.identity-chip {
    display: inline-flex; align-items: center; gap: .25rem;
    padding: .3rem .7rem; border-radius: 999px; font-size: .875rem;
    border: 1px solid var(--bs-border-color, rgba(255,255,255,.15));
}
.chip-human { background: rgba(13,110,253,.12); }
.chip-agent { background: rgba(25,135,84,.14); }
.task-card-topline, .activity-card-topline {
    display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; margin-bottom: .5rem;
}
.task-card h4, .activity-card h4 { font-size: 1.05rem; margin-bottom: .4rem; }
.task-meta, .activity-meta {
    display: flex; flex-wrap: wrap; gap: .25rem 1.25rem;
    font-size: .875rem; color: var(--bs-secondary-color, #adb5bd); margin-bottom: .5rem;
}
.task-controls { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: .75rem; }
.inline-form { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; }
.activity-block { font-size: .9rem; margin: .4rem 0; white-space: pre-wrap; word-break: break-word; }
.activity-card p { margin-bottom: .5rem; }

/* Web chat */
.chat-page { max-width: 760px; margin: 0 auto; }
.chat-header { display: flex; align-items: center; justify-content: space-between; margin: 1rem 0 1.5rem; }
.chat-messages { display: flex; flex-direction: column; gap: .75rem; min-height: 300px; max-height: 60vh; overflow-y: auto; padding: .5rem 0; }
.chat-row { display: flex; }
.chat-row-user { justify-content: flex-end; }
.chat-row-assistant { justify-content: flex-start; }
.chat-bubble { max-width: 78%; padding: .65rem 1rem; border-radius: 1rem; font-size: .95rem; }
.bubble-user { background: var(--bs-primary, #0d6efd); color: #fff; border-bottom-right-radius: .25rem; }
.bubble-assistant { background: var(--bs-tertiary-bg, rgba(255,255,255,.06)); border: 1px solid var(--bs-border-color, rgba(255,255,255,.12)); border-bottom-left-radius: .25rem; }
.chat-content { white-space: pre-wrap; word-break: break-word; }
.chat-error { color: var(--bs-danger, #dc3545); }
.chat-input-form { display: flex; gap: .5rem; margin-top: 1rem; }
.chat-input-form textarea { flex: 1; }

/* Agent long-term memory */
.memory-list { list-style: none; margin: 0; padding: 0; }
.memory-item {
    align-items: flex-start;
    background: var(--bs-tertiary-bg, rgba(255,255,255,.04));
    border: 1px solid var(--bs-border-color, rgba(255,255,255,.12));
    border-radius: .75rem;
    display: flex;
    gap: 1rem;
    justify-content: space-between;
    margin-bottom: .75rem;
    padding: .85rem 1rem;
}
.memory-body { flex: 1; min-width: 0; }
.memory-meta { align-items: center; display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: .4rem; }
.memory-content { white-space: pre-wrap; word-break: break-word; }

/* Live tasks inside milestone cards */
.live-task-list { list-style: none; margin: .5rem 0; padding: 0; }
.live-task-item {
    display: flex; align-items: center; gap: .5rem;
    border: 1px solid var(--bs-border-color, rgba(255,255,255,.12));
    border-radius: .4rem; padding: .4rem .6rem; margin-bottom: .35rem;
    cursor: pointer;
}
.live-task-item:hover { background: rgba(255,255,255,.04); }
.task-status-icon { flex-shrink: 0; font-size: .95rem; }
.live-task-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.new-task-form { display: flex; gap: .5rem; margin: .5rem 0; }
.new-task-form input { flex: 1; }

/* Admin user management */
.admin-page { max-width: 1120px; margin: 0 auto; }
.admin-hero,
.admin-section-heading,
.admin-user-main,
.admin-user-title-row,
.admin-user-actions,
.admin-search {
    align-items: center;
    display: flex;
}
.admin-hero,
.admin-section-heading { justify-content: space-between; gap: 1rem; margin-bottom: 1.25rem; }
.admin-hero h1,
.admin-section-heading h2 { margin-bottom: .25rem; }
.admin-secure-badge {
    align-items: center; background: rgba(34, 197, 94, .1); border: 1px solid rgba(34, 197, 94, .35);
    border-radius: 999px; color: #86efac; display: inline-flex; font-size: .85rem; font-weight: 600;
    gap: .4rem; padding: .45rem .75rem; white-space: nowrap;
}
.admin-secure-badge svg { fill: currentColor; height: 1rem; width: 1rem; }
.admin-stat-grid { display: grid; gap: .75rem; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 2rem; }
.admin-stat {
    background: #0f172a; border: 1px solid #334155; border-radius: .75rem; display: flex;
    flex-direction: column; gap: .35rem; padding: 1rem;
}
.admin-stat span { color: #94a3b8; font-size: .82rem; }
.admin-stat strong { color: #f8fafc; font-size: 1.65rem; }
.admin-stat-pending { border-color: rgba(245, 158, 11, .45); }
.admin-stat-active { border-color: rgba(34, 197, 94, .45); }
.admin-stat-suspended { border-color: rgba(239, 68, 68, .45); }
.admin-search { gap: .5rem; min-width: min(100%, 380px); }
.admin-user-list { display: grid; gap: .75rem; }
.admin-user-card {
    align-items: center; background: #0f172a; border: 1px solid #334155; border-radius: .75rem;
    display: flex; gap: 1rem; justify-content: space-between; padding: 1rem;
}
.admin-user-main { gap: .8rem; min-width: 0; }
.admin-user-avatar {
    align-items: center; background: #1e293b; border: 1px solid #475569; border-radius: 50%;
    color: #f8fafc; display: inline-flex; flex: 0 0 2.5rem; font-weight: 700; height: 2.5rem;
    justify-content: center; width: 2.5rem;
}
.admin-user-copy { min-width: 0; }
.admin-user-title-row { flex-wrap: wrap; gap: .45rem; }
.admin-user-title-row h3 { font-size: 1rem; margin: 0; overflow-wrap: anywhere; }
.admin-user-status,
.admin-you-badge,
.admin-role { border-radius: 999px; font-size: .72rem; font-weight: 600; padding: .2rem .5rem; }
.status-pending { background: rgba(245, 158, 11, .13); color: #fcd34d; }
.status-active { background: rgba(34, 197, 94, .13); color: #86efac; }
.status-suspended { background: rgba(239, 68, 68, .13); color: #fca5a5; }
.admin-you-badge { background: rgba(56, 189, 248, .13); color: #7dd3fc; }
.admin-role-list { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .45rem; }
.admin-role { background: #1e293b; color: #cbd5e1; font-weight: 500; }
.admin-user-actions { flex-wrap: wrap; gap: .5rem; justify-content: flex-end; }
.admin-empty { border: 1px dashed #475569; border-radius: .75rem; color: #94a3b8; padding: 2rem; text-align: center; }

.account-pending-page { display: grid; min-height: 65vh; place-items: center; }
.account-pending-card {
    background: #0f172a; border: 1px solid #334155; border-radius: 1rem; max-width: 580px;
    padding: clamp(1.5rem, 5vw, 3rem); text-align: center;
}
.account-pending-icon {
    align-items: center; background: rgba(245, 158, 11, .13); border-radius: 50%; color: #fcd34d;
    display: inline-flex; height: 3.5rem; justify-content: center; margin-bottom: 1rem; width: 3.5rem;
}
.account-pending-icon svg { fill: currentColor; height: 1.8rem; width: 1.8rem; }

@media (max-width: 767.98px) {
    .admin-hero,
    .admin-section-heading,
    .admin-user-card { align-items: stretch; flex-direction: column; }
    .admin-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .admin-search { min-width: 0; width: 100%; }
    .admin-user-actions { justify-content: stretch; }
    .admin-user-actions form,
    .admin-user-actions button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}

/* Billing and operator financial views */
.billing-page { max-width: 1120px; margin: 0 auto; }
.balance-card { background: linear-gradient(135deg, #0f766e, #155e75); border: 1px solid #2dd4bf; border-radius: .9rem; display: flex; flex-direction: column; min-width: 190px; padding: .9rem 1.1rem; }
.balance-card span { color: #ccfbf1; font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; }
.balance-card strong { color: #fff; font-size: 1.6rem; }
.billing-grid { display: grid; gap: 1rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 767.98px) { .billing-grid { grid-template-columns: 1fr; } .balance-card { width: 100%; } }

/* Optional workspace onboarding */
.onboarding-steps { display: grid; gap: .75rem; max-width: 42rem; }
.onboarding-step { display: flex; align-items: flex-start; gap: 1rem; padding: 1rem; border: 1px solid #334155; border-radius: 1rem; background: #111a24; }
.onboarding-number { display: inline-grid; place-items: center; flex: 0 0 2rem; height: 2rem; border-radius: 50%; background: #0c4a6e; color: #bae6fd; font-weight: 700; }
.workspace-hero { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; gap: 1rem; margin-bottom: 1.5rem; }
.workspace-guide { border: 1px solid #155e75; border-radius: 1rem; padding: 1.5rem; background: linear-gradient(135deg, #122638, #111a24); margin-bottom: 1.5rem; }
.workspace-card { border: 1px solid #334155; border-radius: 1rem; padding: 1.5rem; background: #111a24; }
.workspace-card h3 { overflow-wrap: anywhere; }
.workspace-create { max-width: 48rem; }
