anentrypoint-design 0.0.222 → 0.0.224

package/colors_and_type.css

@@ -121,6 +121,7 @@
   --panel-0:      var(--bg);
   --panel-1:      var(--bg-2);
   --panel-2:      var(--bg-3);
+  --panel-hover:  color-mix(in oklab, var(--fg) 4%, var(--panel-1));
   --panel-3:      color-mix(in oklab, var(--fg) 12%, transparent);
   --panel-text:   var(--fg);
   --panel-text-2: var(--fg-2);

package/dist/247420.css

@@ -123,6 +123,7 @@
   --panel-0:      var(--bg);
   --panel-1:      var(--bg-2);
   --panel-2:      var(--bg-3);
+  --panel-hover:  color-mix(in oklab, var(--fg) 4%, var(--panel-1));
   --panel-3:      color-mix(in oklab, var(--fg) 12%, transparent);
   --panel-text:   var(--fg);
   --panel-text-2: var(--fg-2);
@@ -8122,6 +8123,188 @@
   }
 }
 
+/* gm-prose.css */
+/* ============================================================
+   gm-prose — long-form article + doc-site prose surfaces
+   Extracted-article host, sticky table-of-contents rail, CLI
+   transcript block, definition-panel rows, repo cards, tag
+   chips, and attributed callouts. Consumed pro-rata by doc
+   sites (the gm paper) that mount the SDK and inject a flatspace
+   article into #ds-article-host. Every color is a token from
+   colors_and_type.css; no raw literals.
+   ============================================================ */
+
+.ds-247420 .ds-prose { line-height: 1.65; }
+.ds-247420 .ds-prose pre, .ds-247420 .ds-prose table { overflow-x: auto; max-width: 100%; }
+
+.ds-247420 #ds-article-host, .ds-247420 .ds-prose {
+  width: 100%;
+  max-width: 100%;
+  overflow: visible;
+  min-height: 0;
+}
+
+.ds-247420 #ds-article-host.has-toc {
+  display: grid;
+  grid-template-columns: 256px minmax(0, var(--measure-narrow));
+  column-gap: 44px;
+  align-items: start;
+}
+.ds-247420 #ds-article-host.has-toc > .toc {
+  grid-column: 1;
+  grid-row: 1 / -1;
+  position: sticky;
+  top: 24px;
+  align-self: start;
+  max-height: calc(100vh - 48px);
+  overflow-y: auto;
+  overscroll-behavior: contain;
+  margin: 0;
+  max-width: 100%;
+  padding: 18px 18px 18px 20px;
+  background: var(--panel-1);
+  border-radius: 10px;
+  box-shadow: var(--panel-shadow);
+  scrollbar-width: thin;
+  scrollbar-color: var(--panel-3) transparent;
+}
+.ds-247420 #ds-article-host.has-toc > .toc::-webkit-scrollbar { width: 8px; }
+.ds-247420 #ds-article-host.has-toc > .toc::-webkit-scrollbar-track { background: transparent; }
+.ds-247420 #ds-article-host.has-toc > .toc::-webkit-scrollbar-thumb {
+  background: var(--panel-3);
+  border-radius: 8px;
+  border: 2px solid transparent;
+  background-clip: padding-box;
+}
+.ds-247420 #ds-article-host.has-toc > .toc::-webkit-scrollbar-thumb:hover {
+  background: var(--panel-text-3);
+  background-clip: padding-box;
+}
+.ds-247420 #ds-article-host .toc .toc-title {
+  font-family: var(--ff-mono);
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: .09em;
+  color: var(--panel-text-2);
+  margin: 0 0 14px 0;
+}
+.ds-247420 #ds-article-host .toc ol { margin: 0; padding-left: 18px; }
+.ds-247420 #ds-article-host .toc li { font-size: 13px; line-height: 1.85; color: var(--panel-text); }
+.ds-247420 #ds-article-host .toc li::marker { color: var(--panel-text-3); font-variant-numeric: tabular-nums; }
+.ds-247420 #ds-article-host .toc a { color: var(--panel-text-2); text-decoration: none; transition: color .12s ease; }
+.ds-247420 #ds-article-host .toc a:hover { color: var(--panel-accent); }
+.ds-247420 #ds-article-host.has-toc > :not(.toc) { grid-column: 2; min-width: 0; }
+@media (max-width: 900px) {
+  .ds-247420 #ds-article-host.has-toc { display: block; }
+  .ds-247420 #ds-article-host.has-toc > .toc {
+    position: static;
+    max-height: none;
+    overflow: visible;
+    margin: 0 0 28px 0;
+  }
+}
+
+.ds-247420 .cli {
+  display: block;
+  background: var(--panel-1);
+  border-radius: 8px;
+  padding: 16px 20px;
+  margin: 16px 0 28px 0;
+  font-family: var(--ff-mono);
+  font-size: 12.5px;
+  line-height: 1.6;
+  color: var(--panel-text);
+  box-shadow: var(--panel-shadow);
+  overflow-x: auto;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+.ds-247420 .cli .cli-cmt {
+  color: var(--panel-text-3);
+  white-space: pre-wrap;
+  word-break: break-word;
+  min-height: 1.4em;
+  padding: 3px 0;
+  line-height: 1.6;
+}
+.ds-247420 .cli .cli-cmt:empty::before { content: '\00a0'; }
+.ds-247420 .cli .cli-line {
+  display: flex;
+  gap: 10px;
+  padding: 3px 0;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+.ds-247420 .cli .cli-line .prompt {
+  color: var(--panel-accent);
+  flex: 0 0 auto;
+  user-select: none;
+}
+.ds-247420 .cli .cli-line .cmd {
+  color: var(--panel-text);
+  flex: 1 1 auto;
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
+.ds-247420 .panel .row { align-items: flex-start; padding: 16px 20px; gap: 16px; }
+.ds-247420 .panel .row + .row { box-shadow: inset 0 1px 0 var(--rule); }
+.ds-247420 .panel .row .code { padding-top: 2px; min-width: 28px; }
+.ds-247420 .panel .row .meta { padding-top: 2px; opacity: 0.4; }
+.ds-247420 .panel .row .title { display: block; line-height: 1.4; }
+.ds-247420 .panel .row .title .sub {
+  display: block;
+  margin-top: 6px;
+  font-weight: 400;
+  color: var(--panel-text-2);
+  font-size: 13px;
+  line-height: 1.6;
+}
+
+.ds-247420 .ds-prose .card {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding: 14px 18px;
+  margin: 8px 0;
+  background: var(--panel-1);
+  border-radius: 6px;
+  font-size: 13px;
+  box-shadow: var(--panel-shadow);
+  text-decoration: none;
+}
+.ds-247420 .ds-prose .card:hover { background: var(--panel-hover); }
+.ds-247420 .ds-prose .card .card-top { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
+.ds-247420 .ds-prose .card .repo-name { font-weight: 600; color: var(--panel-text); }
+.ds-247420 .ds-prose .card .stars { color: var(--panel-text-3); font-family: var(--ff-mono); font-size: 12px; flex: 0 0 auto; }
+.ds-247420 .ds-prose .card .desc { color: var(--panel-text-2); font-size: 12px; line-height: 1.5; margin: 0; }
+.ds-247420 .ds-prose .tags { display: flex; gap: 6px; flex-wrap: wrap; }
+.ds-247420 .ds-prose .tag {
+  background: var(--panel-2);
+  color: var(--panel-text-2);
+  border: 1px solid var(--panel-3);
+  font-size: 0.7rem;
+  padding: 0.15rem 0.5rem;
+  border-radius: 3px;
+  font-family: var(--ff-mono);
+}
+.ds-247420 .ds-prose .gm-callout {
+  margin: 18px 0;
+  padding: 14px 18px;
+  background: var(--panel-1);
+  border-left: 3px solid var(--panel-accent);
+  color: var(--panel-text);
+}
+.ds-247420 .ds-prose .gm-callout .who {
+  display: block;
+  font-family: var(--ff-mono);
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: .08em;
+  color: var(--panel-text-2);
+  margin-bottom: 4px;
+}
+
 /* marketing.css */
 /* marketing.css — landing / docs site surface family (the agentgui flatspace
  * site renderer composes these instead of carrying inline style= props). Every