ltcai 7.6.0 → 7.8.0

package/frontend/src/styles.css

@@ -1301,7 +1301,7 @@ body {
   flex: 1 1 auto;
   display: flex;
   flex-direction: column;
-  max-width: 780px;
+  max-width: 1180px;
   margin: 0 auto;
   width: 100%;
   padding: 0 1.25rem 1.75rem;
@@ -1320,11 +1320,35 @@ body {
   text-transform: uppercase;
 }
 
-.brain-ownership-strip {
+.brain-conversation-title {
+  min-width: min(100%, 18rem);
+}
+
+.brain-conversation-title h1 {
   display: flex;
-  flex: 1 1 auto;
-  justify-content: center;
+  flex-wrap: wrap;
+  align-items: center;
   gap: 0.45rem;
+  margin: 0;
+}
+
+.brain-conversation-title > span {
+  display: block;
+  margin-top: 0.18rem;
+  color: hsl(var(--fg-muted));
+  font-size: 0.72rem;
+  font-weight: 760;
+  letter-spacing: 0;
+  line-height: 1.25;
+  text-transform: none;
+}
+
+.brain-header-tools,
+.brain-ownership-strip {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 0.5rem;
   min-width: 0;
 }
 
@@ -1415,12 +1439,374 @@ body {
   flex: 0 0 auto;
 }
 
+.brain-chat-home-layout {
+  display: grid;
+  grid-template-columns: minmax(0, 1fr);
+  gap: 1rem;
+  align-items: start;
+  max-width: 880px;
+  width: 100%;
+  margin: 0 auto;
+}
+
+.brain-chat-home-card {
+  display: grid;
+  min-height: min(70vh, 46rem);
+  border: 1px solid hsl(var(--brain-core) / 0.3);
+  border-radius: 8px;
+  background:
+    linear-gradient(180deg, hsl(var(--surface-glass)), hsl(var(--surface) / 0.74)),
+    radial-gradient(80% 70% at 16% 0%, hsl(var(--brain-core) / 0.12), transparent 70%);
+  box-shadow: 0 18px 44px hsl(200 30% 3% / 0.18);
+  overflow: hidden;
+  backdrop-filter: blur(18px);
+}
+
+.brain-chat-home-head {
+  display: flex;
+  justify-content: space-between;
+  gap: 1rem;
+  border-bottom: 1px solid hsl(var(--border) / 0.5);
+  padding: 1rem 1rem 0.85rem;
+}
+
+.brain-chat-home-head span {
+  display: inline-flex;
+  color: hsl(var(--fg-muted));
+  font-size: 0.64rem;
+  font-weight: 840;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+}
+
+.brain-chat-home-head h2 {
+  margin: 0.18rem 0 0.32rem;
+  color: hsl(var(--fg));
+  font-size: clamp(1.35rem, 2vw, 1.8rem);
+  font-weight: 760;
+  line-height: 1.08;
+  letter-spacing: 0;
+}
+
+.brain-chat-home-head p {
+  max-width: 42rem;
+  margin: 0;
+  color: hsl(var(--fg-muted));
+  font-size: 0.9rem;
+  line-height: 1.45;
+}
+
+.brain-chat-home-proof {
+  display: flex;
+  flex: 0 0 auto;
+  flex-direction: column;
+  align-items: flex-end;
+  gap: 0.4rem;
+}
+
+.brain-chat-home-proof span {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.32rem;
+  min-height: 1.8rem;
+  border: 1px solid hsl(var(--border) / 0.54);
+  border-radius: 999px;
+  background: hsl(var(--surface) / 0.65);
+  color: hsl(var(--fg-muted));
+  padding: 0 0.56rem;
+  font-size: 0.68rem;
+  font-weight: 780;
+  letter-spacing: 0;
+  text-transform: none;
+  white-space: nowrap;
+}
+
+.brain-chat-home-proof svg {
+  color: hsl(var(--success));
+}
+
 .brain-stream {
   flex: 1 1 auto;
+  min-height: 19rem;
+  max-height: 32rem;
   overflow-y: auto;
-  padding: 1rem 0.25rem 1.5rem;
+  padding: 0.9rem 1rem 1rem;
   scroll-behavior: smooth;
-  mask-image: linear-gradient(transparent, black 6%, black 92%, transparent);
+  mask-image: linear-gradient(transparent, black 4%, black 96%, transparent);
+}
+
+.brain-context-rail {
+  display: grid;
+  gap: 0.85rem;
+  position: sticky;
+  top: 1rem;
+  min-width: 0;
+}
+
+.brain-context-rail .brain-command-center,
+.brain-context-rail .brain-ingestion-panel,
+.brain-context-rail .brain-emergence-timeline,
+.brain-context-rail .brain-model-demo {
+  margin: 0;
+}
+
+.brain-context-rail .brain-command-actions,
+.brain-context-rail .brain-ingestion-grid {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+
+.brain-context-rail .brain-command-actions button,
+.brain-context-rail .brain-ingest-tile {
+  min-height: 4.6rem;
+}
+
+.brain-context-rail .brain-ingest-tile input {
+  min-width: 0;
+}
+
+.brain-utility-drawer {
+  border-top: 1px solid hsl(var(--border) / 0.5);
+  background: hsl(var(--bg) / 0.2);
+}
+
+.brain-utility-drawer > summary {
+  display: flex;
+  min-height: 2.8rem;
+  cursor: pointer;
+  align-items: center;
+  justify-content: center;
+  color: hsl(var(--fg-muted));
+  font-size: 0.78rem;
+  font-weight: 820;
+  list-style: none;
+  transition: color 150ms ease, background 150ms ease;
+}
+
+.brain-utility-drawer > summary::-webkit-details-marker {
+  display: none;
+}
+
+.brain-utility-drawer > summary:hover,
+.brain-utility-drawer > summary:focus-visible {
+  background: hsl(var(--brain-core) / 0.06);
+  color: hsl(var(--fg));
+  outline: none;
+}
+
+.brain-utility-grid {
+  display: grid;
+  gap: 0.85rem;
+  border-top: 1px solid hsl(var(--border) / 0.5);
+  padding: 0.85rem;
+}
+
+.brain-utility-grid .brain-command-center,
+.brain-utility-grid .brain-ingestion-panel,
+.brain-utility-grid .brain-emergence-timeline,
+.brain-utility-grid .brain-model-demo,
+.brain-utility-grid .brain-overview-panel,
+.brain-utility-grid .brain-care-panel {
+  margin: 0;
+}
+
+.brain-edition-badge,
+.ritual-edition {
+  display: inline-flex;
+  align-items: center;
+  min-height: 1.35rem;
+  border: 1px solid hsl(var(--brain-core) / 0.42);
+  border-radius: 999px;
+  background: hsl(var(--brain-core) / 0.1);
+  color: hsl(var(--fg));
+  padding: 0 0.48rem;
+  font-size: 0.62rem;
+  font-weight: 820;
+  letter-spacing: 0;
+  white-space: nowrap;
+}
+
+.brain-edition-badge {
+  margin-left: 0.45rem;
+  vertical-align: middle;
+}
+
+.ritual-edition {
+  position: absolute;
+  right: 50%;
+  bottom: 0.35rem;
+  transform: translateX(50%);
+  background: hsl(var(--surface-glass));
+  box-shadow: 0 10px 24px hsl(200 30% 3% / 0.18);
+}
+
+.brain-command-center {
+  display: grid;
+  gap: 0.72rem;
+  margin: 0 0 0.85rem;
+  border: 1px solid hsl(var(--brain-core) / 0.36);
+  border-radius: 8px;
+  background: linear-gradient(135deg, hsl(var(--surface-glass)), hsl(var(--brain-core) / 0.07));
+  padding: 0.82rem;
+  box-shadow: 0 14px 34px hsl(200 30% 3% / 0.16);
+  backdrop-filter: blur(18px);
+}
+
+.brain-command-head,
+.brain-command-next,
+.brain-command-metrics,
+.brain-command-signals {
+  display: flex;
+  align-items: center;
+  gap: 0.55rem;
+}
+
+.brain-command-head {
+  justify-content: space-between;
+}
+
+.brain-command-head span,
+.brain-command-next span,
+.brain-command-score span {
+  display: block;
+  color: hsl(var(--fg-muted));
+  font-size: 0.64rem;
+  font-weight: 840;
+  text-transform: uppercase;
+}
+
+.brain-command-head strong {
+  display: block;
+  margin-top: 0.12rem;
+  font-size: 0.98rem;
+}
+
+.brain-command-score {
+  display: grid;
+  justify-items: end;
+  min-width: 5.9rem;
+}
+
+.brain-command-score strong {
+  color: hsl(var(--brain-core));
+  font-size: 1.45rem;
+  line-height: 1;
+}
+
+.brain-command-next {
+  min-height: 2.35rem;
+  border: 1px solid hsl(var(--border) / 0.54);
+  border-radius: 8px;
+  background: hsl(var(--bg) / 0.34);
+  padding: 0.5rem 0.58rem;
+}
+
+.brain-command-next svg {
+  color: hsl(var(--brain-core));
+}
+
+.brain-command-next strong {
+  min-width: 0;
+  color: hsl(var(--fg));
+  font-size: 0.82rem;
+  line-height: 1.25;
+}
+
+.brain-command-metrics {
+  flex-wrap: wrap;
+}
+
+.brain-command-metrics span,
+.brain-command-signals span {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.28rem;
+  min-height: 1.65rem;
+  border: 1px solid hsl(var(--border) / 0.5);
+  border-radius: 999px;
+  background: hsl(var(--surface) / 0.6);
+  color: hsl(var(--fg-muted));
+  padding: 0 0.5rem;
+  font-size: 0.68rem;
+  font-weight: 760;
+}
+
+.brain-command-actions {
+  display: grid;
+  grid-template-columns: repeat(4, minmax(0, 1fr));
+  gap: 0.5rem;
+}
+
+.brain-command-actions button {
+  display: grid;
+  min-height: 5.1rem;
+  align-content: start;
+  gap: 0.28rem;
+  border: 1px solid hsl(var(--border) / 0.55);
+  border-radius: 8px;
+  background: hsl(var(--surface) / 0.64);
+  color: hsl(var(--fg));
+  padding: 0.58rem;
+  text-align: left;
+  transition: border-color 150ms ease, background 150ms ease, transform 150ms ease;
+}
+
+.brain-command-actions button:hover,
+.brain-command-actions button:focus-visible {
+  border-color: hsl(var(--brain-core) / 0.66);
+  background: hsl(var(--brain-core) / 0.08);
+  outline: none;
+  transform: translateY(-1px);
+}
+
+.brain-command-actions svg {
+  color: hsl(var(--brain-core));
+}
+
+.brain-command-actions span {
+  font-size: 0.78rem;
+  font-weight: 820;
+  line-height: 1.18;
+}
+
+.brain-command-actions small {
+  overflow: hidden;
+  color: hsl(var(--fg-muted));
+  font-size: 0.68rem;
+  line-height: 1.2;
+  text-overflow: ellipsis;
+}
+
+.brain-command-signals {
+  flex-wrap: wrap;
+}
+
+.brain-command-signals svg {
+  color: hsl(var(--success));
+}
+
+@media (max-width: 760px) {
+  .brain-command-head,
+  .brain-command-next {
+    align-items: flex-start;
+  }
+
+  .brain-command-head {
+    flex-direction: column;
+  }
+
+  .brain-command-score {
+    justify-items: start;
+  }
+
+  .brain-command-actions {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+@media (max-width: 460px) {
+  .brain-command-actions {
+    grid-template-columns: 1fr;
+  }
 }
 
 .brain-ingestion-panel {
@@ -2329,6 +2715,29 @@ body {
   flex-direction: column;
 }
 
+.brain-product-intro {
+  width: min(100%, 44rem);
+  margin: 0.9rem auto 0.35rem;
+  padding-inline: 1rem;
+  text-align: center;
+}
+
+.brain-product-kicker {
+  color: hsl(var(--brain-core));
+  font-size: 0.72rem;
+  font-weight: 860;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+}
+
+.brain-product-line {
+  margin-top: 0.22rem;
+  color: hsl(var(--fg));
+  font-size: 1rem;
+  font-weight: 620;
+  line-height: 1.35;
+}
+
 .brain-organism {
   z-index: 3;
 }
@@ -3686,6 +4095,7 @@ body {
 }
 
 .ritual-brain {
+  position: relative;
   margin: 1.4rem auto 1.6rem;
 }
 
@@ -3702,23 +4112,26 @@ body {
 
 /* Gentle empty / loading for the mind */
 .mind-empty {
-  text-align: center;
-  padding: 2.4rem 1rem;
+  display: grid;
+  align-content: center;
+  text-align: left;
+  min-height: 18rem;
+  padding: 1.2rem 0.2rem;
   color: hsl(var(--fg-muted));
 }
 
 .mind-empty-title {
   max-width: 34rem;
-  margin: 0 auto 0.5rem;
+  margin: 0 0 0.5rem;
   color: hsl(var(--fg));
-  font-size: 1.1rem;
-  font-weight: 650;
+  font-size: 1.2rem;
+  font-weight: 720;
   line-height: 1.2;
 }
 
 .mind-empty p {
   max-width: 39rem;
-  margin: 0 auto;
+  margin: 0;
   font-size: 0.9rem;
   line-height: 1.45;
 }
@@ -3755,9 +4168,8 @@ body {
 }
 
 .mind-empty-prompts {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 0.48rem;
   margin-top: 1rem;
 }
@@ -3765,12 +4177,13 @@ body {
 .mind-empty-prompts button {
   max-width: 100%;
   border: 1px solid hsl(var(--border) / 0.62);
-  border-radius: 999px;
+  border-radius: 8px;
   background: hsl(var(--bg) / 0.46);
   color: hsl(var(--fg));
-  padding: 0.46rem 0.7rem;
+  padding: 0.62rem 0.7rem;
   font-size: 0.78rem;
   line-height: 1.15;
+  text-align: left;
   transition: border-color 150ms ease, background 150ms ease, transform 150ms ease;
 }
 
@@ -3785,9 +4198,9 @@ body {
 .mind-empty-trail {
   display: flex;
   flex-wrap: wrap;
-  justify-content: center;
+  justify-content: flex-start;
   gap: 0.45rem;
-  margin: 1rem auto 0;
+  margin: 1rem 0 0;
   max-width: 40rem;
 }
 
@@ -3830,8 +4243,27 @@ body {
 @media (max-width: 720px) {
   .brain-presence { padding-top: 1.4rem; }
   .brain-organism { width: 200px; height: 200px; }
-  .brain-conversation { padding-bottom: 5.5rem; }
-  .brain-conversation-header { flex-wrap: wrap; }
+  .brain-conversation { padding: 0 0.75rem 5.5rem; }
+  .brain-conversation-header,
+  .brain-chat-home-head,
+  .brain-header-tools {
+    align-items: flex-start;
+    flex-direction: column;
+  }
+  .brain-header-tools {
+    width: 100%;
+  }
+  .brain-chat-home-layout {
+    grid-template-columns: 1fr;
+  }
+  .brain-context-rail {
+    position: static;
+  }
+  .brain-chat-home-proof {
+    align-items: flex-start;
+    flex-direction: row;
+    flex-wrap: wrap;
+  }
   .brain-depth-actions {
     bottom: 3.55rem;
     width: min(100vw - 1rem, 24rem);
@@ -3912,6 +4344,7 @@ body {
   }
   .mind-empty-prompts {
     display: grid;
+    grid-template-columns: 1fr;
   }
   .mind-empty-prompts button {
     width: 100%;
@@ -3920,6 +4353,10 @@ body {
   .ritual-promise {
     grid-template-columns: 1fr;
   }
+  .ritual-value-grid,
+  .ritual-wake-plan {
+    grid-template-columns: 1fr;
+  }
   .brain-ownership-strip { order: 3; flex-basis: 100%; justify-content: flex-start; overflow-x: auto; }
   .depths { bottom: 0.9rem; }
 }
@@ -3987,6 +4424,48 @@ body {
   line-height: 1.22;
 }
 
+.ritual-value-grid {
+  display: grid;
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+  gap: 0.65rem;
+  width: min(100%, 640px);
+  margin: 0.15rem auto 0.25rem;
+}
+
+.ritual-value-card {
+  border: 1px solid hsl(var(--border) / 0.54);
+  border-radius: 8px;
+  background: hsl(var(--surface-glass));
+  padding: 0.78rem 0.82rem;
+  text-align: left;
+  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
+}
+
+.ritual-value-card:hover,
+.ritual-value-card:focus-within {
+  transform: translateY(-1px);
+  border-color: hsl(var(--brain-core) / 0.62);
+  box-shadow: 0 8px 22px hsl(var(--brain-core) / 0.09);
+}
+
+.ritual-value-label {
+  display: flex;
+  align-items: center;
+  gap: 0.42rem;
+  color: hsl(var(--brain-core));
+  font-size: 0.72rem;
+  font-weight: 840;
+  letter-spacing: 0;
+}
+
+.ritual-value-body {
+  margin-top: 0.24rem;
+  color: hsl(var(--fg));
+  font-size: 0.84rem;
+  font-weight: 620;
+  line-height: 1.28;
+}
+
 .ritual-secondary-button {
   min-height: 2.75rem;
   border: 1px solid hsl(var(--border) / 0.64);
@@ -4100,7 +4579,41 @@ body {
 }
 
 .ritual-full-button {
+  min-height: 2.75rem;
+  border: 1px solid hsl(var(--brain-core) / 0.62);
+  border-radius: 8px;
+  background: hsl(var(--brain-core));
+  color: hsl(var(--bg));
+  padding: 0 1.2rem;
+  font-weight: 800;
+  cursor: pointer;
   margin-top: 1rem;
+  box-shadow: 0 8px 24px hsl(var(--brain-core) / 0.18);
+  transition: transform 140ms ease, box-shadow 140ms ease, border-color 140ms ease;
+}
+
+.ritual-full-button:hover,
+.ritual-full-button:focus-visible {
+  transform: translateY(-1px);
+  border-color: hsl(var(--brain-halo));
+  box-shadow: 0 12px 30px hsl(var(--brain-core) / 0.24);
+  outline: none;
+}
+
+.ritual-full-button-primary,
+.ritual-primary-model-button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.5rem;
+}
+
+.ritual-full-button-primary {
+  min-width: min(100%, 18rem);
+  margin-top: 0;
+  padding: 0.85rem 2.15rem;
+  font-size: 1.02rem;
+  font-weight: 820;
 }
 
 .ritual-note,
@@ -4201,6 +4714,12 @@ body {
 
 .ritual-model-card {
   text-align: left;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 0.32rem;
+  position: relative;
+  overflow: hidden;
   padding: 1.15rem 1.35rem;
   margin-bottom: 0.7rem;
   cursor: pointer;
@@ -4210,28 +4729,65 @@ body {
   transition: all 160ms ease;
 }
 
+.ritual-model-card::after {
+  content: "";
+  position: absolute;
+  top: -55%;
+  left: -115%;
+  width: 40%;
+  height: 210%;
+  background: linear-gradient(120deg, transparent, hsl(var(--brain-core) / 0.1), transparent);
+  transition: left 420ms ease;
+}
+
 .ritual-model-card:hover {
   border-color: hsl(var(--brain-core) / 0.5);
   background: hsl(var(--surface) / 0.95);
 }
 
+.ritual-model-card:hover::after,
+.ritual-model-card:focus-visible::after {
+  left: 240%;
+}
+
+.ritual-model-heading {
+  display: flex;
+  align-items: center;
+  gap: 0.42rem;
+  width: 100%;
+  color: hsl(var(--brain-core));
+}
+
 .ritual-model-card .role {
   font-size: 0.7rem;
   letter-spacing: 1px;
   text-transform: uppercase;
   color: hsl(var(--brain-core));
-  margin-bottom: 0.3rem;
+  margin-bottom: 0;
 }
 
 .ritual-model-card .name {
-  font-size: 1.25rem;
+  font-size: 1.15rem;
   font-weight: 650;
 }
 
 .ritual-model-card .reason {
-  font-size: 0.92rem;
+  font-size: 0.9rem;
   color: hsl(var(--fg-muted));
-  margin-top: 0.25rem;
+  margin-top: 0;
+}
+
+.ritual-model-stats {
+  margin-top: 0.1rem;
+}
+
+.ritual-model-choose {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  margin-top: 0.2rem;
+  color: hsl(var(--brain-core));
+  font-weight: 780;
 }
 
 .ritual-model-warning {
@@ -4253,10 +4809,20 @@ body {
   margin-top: 1.1rem;
 }
 
+.ritual-button-row-primary {
+  margin-top: 1.25rem;
+}
+
 .ritual-muted-hint {
   font-size: 0.82rem;
 }
 
+.ritual-start-note {
+  margin-top: 0.8rem;
+  color: hsl(var(--fg-muted));
+  font-size: 0.72rem;
+}
+
 .ritual-install-brain {
   margin: 0.6rem auto 1rem;
 }
@@ -6009,4 +6575,5 @@ body {
     left: 50%;
     transform: translateX(-50%);
   }
+
 }