From 189c6dcedb3e431353612cd898c43c56778f1ac6 Mon Sep 17 00:00:00 2001 From: Yvette Carlisle Date: Wed, 13 May 2026 17:03:30 +0800 Subject: [PATCH 01/12] {"schema":"decodex/commit/1","summary":"Flatten site radar homepage","authority":"manual"} --- README.md | 2 +- .../recommendedConfigs.schema.json | 83 --- site/.astro/content.d.ts | 10 +- site/src/components/ReleaseDeltaPanel.astro | 610 ++++-------------- site/src/content.config.ts | 26 - .../openai-codex-prerelease.json | 70 -- site/src/pages/index.astro | 7 +- site/src/styles/global.css | 519 ++++----------- 8 files changed, 240 insertions(+), 1087 deletions(-) delete mode 100644 site/.astro/collections/recommendedConfigs.schema.json delete mode 100644 site/src/content/recommended-configs/openai-codex-prerelease.json diff --git a/README.md b/README.md index 639b6b5f..6457fd8a 100644 --- a/README.md +++ b/README.md @@ -142,7 +142,7 @@ The public site owns: - Codex signal cards - release-delta presentation -- recommended config artifacts +- continuous Radar status presentation - static assets and public page rendering The public site does not own: diff --git a/site/.astro/collections/recommendedConfigs.schema.json b/site/.astro/collections/recommendedConfigs.schema.json deleted file mode 100644 index e081921c..00000000 --- a/site/.astro/collections/recommendedConfigs.schema.json +++ /dev/null @@ -1,83 +0,0 @@ -{ - "$schema": "https://json-schema.org/draft/2020-12/schema", - "type": "object", - "properties": { - "schema": { - "type": "string", - "const": "recommended_config/v1" - }, - "repo": { - "type": "string", - "minLength": 1 - }, - "id": { - "type": "string", - "minLength": 1 - }, - "title": { - "type": "string", - "minLength": 1 - }, - "curator_name": { - "type": "string", - "minLength": 1 - }, - "curator_url": { - "type": "string", - "pattern": "^https:\\/\\/" - }, - "subtitle": { - "type": "string", - "minLength": 1 - }, - "audience_note": { - "type": "string", - "minLength": 1 - }, - "warning": { - "type": "string", - "minLength": 1 - }, - "config_toml": { - "type": "string", - "minLength": 1 - }, - "flags": { - "minItems": 1, - "type": "array", - "items": { - "type": "object", - "properties": { - "name": { - "type": "string", - "minLength": 1 - }, - "description": { - "type": "string", - "minLength": 1 - } - }, - "required": [ - "name", - "description" - ] - } - }, - "$schema": { - "type": "string" - } - }, - "required": [ - "schema", - "repo", - "id", - "title", - "curator_name", - "curator_url", - "subtitle", - "audience_note", - "warning", - "config_toml", - "flags" - ] -} \ No newline at end of file diff --git a/site/.astro/content.d.ts b/site/.astro/content.d.ts index 38ea166d..162968e1 100644 --- a/site/.astro/content.d.ts +++ b/site/.astro/content.d.ts @@ -120,15 +120,7 @@ declare module 'astro:content' { : any; type DataEntryMap = { - "recommendedConfigs": Record; - rendered?: RenderedContent; - filePath?: string; -}>; -"releaseDeltas": Record; - } | null; }; -const { delta, trackedSignals, recommendedConfig } = Astro.props; +const { delta, trackedSignals } = Astro.props; const stableOptions = delta.release_options.stable; const previewOptions = delta.release_options.preview; @@ -42,8 +24,9 @@ const latestComparison = delta.comparisons.find( comparison.stable_tag_name === delta.stable_release.tag_name && comparison.prerelease_tag_name === delta.prerelease.tag_name, ); -const latestComparisonTrackedCount = latestComparison?.tracked_signal_slugs.length ?? 0; const activeComparison = latestComparison ?? defaultComparison(delta); +const activeStable = stableByTag.get(activeComparison.stable_tag_name) ?? delta.stable_release; +const activePreview = previewByTag.get(activeComparison.prerelease_tag_name) ?? delta.prerelease; function hasConcreteTryPath(signal: SignalCardData): boolean { return Boolean(signal.how_to_try && signal.expected_effect); @@ -56,491 +39,144 @@ function isHomepageHighlightSignal(signal: SignalCardData): boolean { return signal.kind === "behavior_change" && signal.impact !== "low"; } -type RecommendedConfigToggle = { - name: string; - display: string; - configPath: string; - cliEnableFlag?: string; - description: string; - schemaUrl?: string; - referenceUrl?: string; - referenceDescription?: string | null; - githubSearchUrl?: string; -}; - -function buildRecommendedConfig(profile: Props["recommendedConfig"]): { - title: string; - curatorName: string; - curatorUrl: string; - subtitle: string; - audienceNote: string; - warning: string; - toggles: RecommendedConfigToggle[]; - tomlSnippet: string | null; -} { - if (!profile) { - return { - title: "", - curatorName: "", - curatorUrl: "", - subtitle: "", - audienceNote: "", - warning: "", - toggles: [], - tomlSnippet: null, - }; - } - - const toggles: RecommendedConfigToggle[] = []; - for (const flag of profile.flags) { - const resolved = resolveFeatureToggleByName(flag.name); - if (!resolved || !resolved.configPath) continue; - toggles.push({ - name: flag.name, - display: resolved.display, - configPath: resolved.configPath, - cliEnableFlag: resolved.cliEnableFlag, - description: flag.description, - schemaUrl: resolved.schemaUrl, - referenceUrl: resolved.referenceUrl, - referenceDescription: resolved.referenceDescription, - githubSearchUrl: resolved.githubSearchUrl, - }); - } - - return { - title: profile.title, - curatorName: profile.curator_name, - curatorUrl: profile.curator_url, - subtitle: profile.subtitle, - audienceNote: profile.audience_note, - warning: profile.warning, - toggles, - tomlSnippet: profile.config_toml.trimEnd(), - }; -} - -const manualRecommendedConfig = buildRecommendedConfig(recommendedConfig); - -const comparisonEntries = delta.comparisons - .map((comparison) => { - const stable = stableByTag.get(comparison.stable_tag_name); - const preview = previewByTag.get(comparison.prerelease_tag_name); - if (!stable || !preview) { - return null; - } - const featuredSignals = trackedSignalsForSlugs(comparison.tracked_signal_slugs, trackedSignals); - const highlightSignals = featuredSignals.filter(isHomepageHighlightSignal); - const latestTrackedAt = featuredSignals.reduce((latest, signal) => { - if (!latest || signal.published_at > latest) return signal.published_at; - return latest; - }, null); - const isLatestPair = - comparison.stable_tag_name === delta.stable_release.tag_name && - comparison.prerelease_tag_name === delta.prerelease.tag_name; - return { - ...comparison, - stable, - preview, - featuredSignals, - highlightSignals, - latestTrackedAt, - isLatestPair, - key: comparisonKey(comparison.stable_tag_name, comparison.prerelease_tag_name), - }; - }) - .filter((entry): entry is NonNullable => Boolean(entry)); - -const comparisonKeysByStable = Object.fromEntries( - stableOptions.map((stable) => [ - stable.tag_name, - comparisonEntries - .filter((entry) => entry.stable_tag_name === stable.tag_name) - .map((entry) => entry.prerelease_tag_name), - ]), -); +const featuredSignals = trackedSignalsForSlugs(activeComparison.tracked_signal_slugs, trackedSignals); +const publicHighlightSignals = trackedSignals.filter(isHomepageHighlightSignal).slice(0, 3); +const latestWindowTrackedAt = featuredSignals.reduce((latest, signal) => { + if (!latest || signal.published_at > latest) return signal.published_at; + return latest; +}, null); +const latestPublicSignalAt = trackedSignals.reduce((latest, signal) => { + if (!latest || signal.published_at > latest) return signal.published_at; + return latest; +}, null); +const tryPathCount = trackedSignals.filter(hasConcreteTryPath).length; --- -
-
- - - From - - to - - +
+
+

Latest checkpoint

+ + {releaseLabel(activeStable, delta.tag_prefix)} + + {releaseLabel(activePreview, delta.tag_prefix)}
- {comparisonEntries.map((entry) => ( -
diff --git a/site/src/content.config.ts b/site/src/content.config.ts index 089fc07b..a236591f 100644 --- a/site/src/content.config.ts +++ b/site/src/content.config.ts @@ -159,23 +159,6 @@ const releaseDeltaSchema = z }); }); -const recommendedConfigSchema = z.object({ - schema: z.literal("recommended_config/v1"), - repo: z.string().min(1), - id: z.string().min(1), - title: z.string().min(1), - curator_name: z.string().min(1), - curator_url: z.string().regex(/^https:\/\//, "curator_url must be an https URL"), - subtitle: z.string().min(1), - audience_note: z.string().min(1), - warning: z.string().min(1), - config_toml: z.string().min(1), - flags: z.array(z.object({ - name: z.string().min(1), - description: z.string().min(1), - })).min(1), -}); - const signals = defineCollection({ loader: glob({ pattern: "**/*.json", @@ -192,16 +175,7 @@ const releaseDeltas = defineCollection({ schema: releaseDeltaSchema, }); -const recommendedConfigs = defineCollection({ - loader: glob({ - pattern: "**/*.json", - base: "./src/content/recommended-configs", - }), - schema: recommendedConfigSchema, -}); - export const collections = { signals, releaseDeltas, - recommendedConfigs, }; diff --git a/site/src/content/recommended-configs/openai-codex-prerelease.json b/site/src/content/recommended-configs/openai-codex-prerelease.json deleted file mode 100644 index a45c160d..00000000 --- a/site/src/content/recommended-configs/openai-codex-prerelease.json +++ /dev/null @@ -1,70 +0,0 @@ -{ - "schema": "recommended_config/v1", - "repo": "openai/codex", - "id": "xavier-prerelease-profile", - "title": "Recommended profile", - "curator_name": "Yvette", - "curator_url": "https://x.com/YvetteCipher", - "subtitle": "Hand-picked for adventurous preview users.", - "audience_note": "Not AI-generated.", - "warning": "Pre-release only; not for stable.", - "config_toml": "[features]\napply_patch_freeform = true\nartifact = true\ncodex_hooks = true\nenable_fanout = true\nmulti_agent_v2 = true\nplugins = true\nprevent_idle_sleep = true\nrealtime_conversation = true\nruntime_metrics = true\ntool_call_mcp_elicitation = true\ntool_search = true\ntool_suggest = true\nundo = true\nvoice_transcription = true\n", - "flags": [ - { - "name": "apply_patch_freeform", - "description": "Use the freeform apply-patch path so pre-release editing behavior stays on." - }, - { - "name": "artifact", - "description": "Turn on artifact outputs and file-producing flows." - }, - { - "name": "codex_hooks", - "description": "Enable hook execution support." - }, - { - "name": "enable_fanout", - "description": "Allow fanout-style multi-lane agent execution." - }, - { - "name": "multi_agent_v2", - "description": "Use the newer multi-agent implementation." - }, - { - "name": "plugins", - "description": "Enable plugin discovery and plugin-backed tooling." - }, - { - "name": "prevent_idle_sleep", - "description": "Prevent idle sleep so long-running sessions stay alive." - }, - { - "name": "realtime_conversation", - "description": "Enable realtime conversation surfaces." - }, - { - "name": "runtime_metrics", - "description": "Expose runtime metrics and instrumentation surfaces." - }, - { - "name": "tool_call_mcp_elicitation", - "description": "Allow MCP elicitation during tool calls." - }, - { - "name": "tool_search", - "description": "Enable the tool-search UI for discovering available tools." - }, - { - "name": "tool_suggest", - "description": "Enable tool suggestion UX." - }, - { - "name": "undo", - "description": "Enable undo support." - }, - { - "name": "voice_transcription", - "description": "Enable voice transcription input." - } - ] -} diff --git a/site/src/pages/index.astro b/site/src/pages/index.astro index fa3f8237..92802149 100644 --- a/site/src/pages/index.astro +++ b/site/src/pages/index.astro @@ -23,7 +23,6 @@ const rawFilter = Astro.url.searchParams.get("filter"); const activeFilter: FilterId = isFilterId(rawFilter) ? rawFilter : "all"; const collectionEntries = await getCollection("signals"); const releaseDeltaEntries = await getCollection("releaseDeltas"); -const recommendedConfigEntries = await getCollection("recommendedConfigs"); const allSignals: SignalCardData[] = sortSignals( collectionEntries.map((entry) => ({ id: entry.id, @@ -35,10 +34,6 @@ const releaseDelta: ReleaseDeltaData | null = releaseDeltaEntries .map((entry) => entry.data as ReleaseDeltaData) .find((entry) => entry.repo === "openai/codex") ?? null; -const recommendedConfig = - recommendedConfigEntries - .map((entry) => entry.data) - .find((entry) => entry.repo === "openai/codex") ?? null; const hasPublishedSignals = signals.length > 0; const groupedSignals = groupSignalsByMonth(signals); const showGroupLabels = groupedSignals.length > 1; @@ -269,7 +264,7 @@ const filterRuntimeScript = `(function () { {releaseDelta ? ( - + ) : null}
diff --git a/site/src/styles/global.css b/site/src/styles/global.css index 67d45bf0..f77dd6d1 100644 --- a/site/src/styles/global.css +++ b/site/src/styles/global.css @@ -125,7 +125,7 @@ h5, h6 { margin: 0; font-weight: 800; - letter-spacing: -0.04em; + letter-spacing: 0; } p, @@ -341,7 +341,7 @@ code { .site-brand__social-handle { font-size: 0.92rem; font-weight: 700; - letter-spacing: -0.02em; + letter-spacing: 0; color: var(--accent); } @@ -506,7 +506,7 @@ code { .appcast-download__title { font-size: 0.86rem; font-weight: 800; - letter-spacing: -0.03em; + letter-spacing: 0; line-height: 1; color: var(--ink); } @@ -612,7 +612,7 @@ code { .appcast-download__version-title { font-size: 0.82rem; font-weight: 800; - letter-spacing: -0.02em; + letter-spacing: 0; line-height: 1.1; color: var(--ink); } @@ -648,7 +648,7 @@ code { color: var(--ink); font-size: 0.86rem; font-weight: 800; - letter-spacing: -0.03em; + letter-spacing: 0; line-height: 1.1; } @@ -662,7 +662,7 @@ code { background: none; font-size: 0.86rem; font-weight: 800; - letter-spacing: -0.03em; + letter-spacing: 0; color: var(--ink); white-space: nowrap; } @@ -713,7 +713,7 @@ code { .reset-stack__question { font-size: 1.28rem; font-weight: 800; - letter-spacing: -0.045em; + letter-spacing: 0; line-height: 1.02; color: var(--ink); } @@ -729,7 +729,7 @@ code { background: var(--bg-soft); font-size: 0.82rem; font-weight: 800; - letter-spacing: -0.01em; + letter-spacing: 0; color: var(--ink); white-space: nowrap; } @@ -840,28 +840,39 @@ code { .release-delta { display: grid; - gap: 1.3rem; - margin-top: 1.15rem; - padding: 1.25rem 1.15rem 1.15rem; - border: 1px solid var(--border); - border-radius: 1rem; - background: var(--panel); + gap: 0.9rem; + margin-top: 1.2rem; + padding: 1.05rem 0 1.05rem; + border-top: 1px solid var(--border); + border-bottom: 1px solid var(--border); + background: transparent; +} + +.release-delta__control-row { + display: flex; + flex-wrap: wrap; + align-items: center; + justify-content: space-between; + gap: 0.5rem 1rem; + padding-bottom: 0.15rem; } .release-delta__hero { display: grid; - gap: 0.45rem; + gap: 0.7rem; padding: 0; } .release-delta__hero-head { display: grid; - gap: 0; + grid-template-columns: minmax(0, 1fr) auto; + gap: 0.9rem 1.5rem; + align-items: start; } .release-delta__hero-copy { display: grid; - gap: 0; + gap: 0.42rem; } .release-delta__eyebrow { @@ -873,191 +884,76 @@ code { text-transform: uppercase; } -.release-delta__chooser { - display: flex; +.release-delta__window-label { + display: inline-flex; flex-wrap: wrap; align-items: center; - gap: 0.45rem; + justify-content: flex-end; + gap: 0.32rem; color: var(--muted); - font-size: 0.88rem; - line-height: 1.5; -} - -.release-delta__inline-select { - display: inline-flex; - align-items: center; + font-size: 0.86rem; + line-height: 1.45; } -.release-delta__select { - appearance: none; - min-width: 0; - border: 0; - border-bottom: 1px solid color-mix(in srgb, var(--accent) 35%, var(--border)); - padding: 0 1rem 0.08rem 0; - background: transparent; +.release-delta__window-label strong { color: var(--ink); - font: inherit; - line-height: 1.25; -} - -.release-delta__select--inline { - font-size: 1rem; - font-weight: 700; - letter-spacing: -0.02em; - padding-right: 0.15rem; -} - -.release-delta__comparison { - display: grid; - gap: 1.15rem; -} - -.release-delta__content-grid { - display: grid; - gap: 0.85rem; -} - -.release-delta__config { - display: grid; - gap: 0.45rem; - padding-bottom: 0.1rem; - border-bottom: 1px solid var(--border); -} - -.release-delta__config-head { - display: grid; - gap: 0.2rem; -} - -.release-delta__config-badges { - display: flex; - flex-wrap: wrap; - gap: 0.45rem; -} - -.release-delta__config-badge { - display: inline-flex; - align-items: center; - border-radius: 999px; - border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--border)); - background: color-mix(in srgb, var(--accent) 5%, var(--panel)); - padding: 0.18rem 0.52rem; - color: var(--muted); - font-size: 0.7rem; - font-weight: 700; - letter-spacing: 0.04em; + font-size: 0.95rem; + font-weight: 800; + letter-spacing: 0; } -.release-delta__config-warning { +.release-delta__title { margin: 0; - max-width: none; - color: var(--ink-soft); - font-size: 0.88rem; - line-height: 1.5; -} - -.release-delta__config-warning code { - border: 1px solid var(--code-border); - border-radius: 0.5rem; - background: var(--code-bg); - padding: 0.12rem 0.38rem; - color: var(--accent); - font-size: 0.92em; + color: var(--ink); + font-size: 1.18rem; + font-weight: 850; + letter-spacing: 0; + line-height: 1.2; } -.release-delta__config-sources { - display: flex; - flex-wrap: wrap; - align-items: center; - gap: 0.2rem; +.release-delta__hero-subcopy { + max-width: 46rem; margin: 0; - color: var(--muted); - font-size: 0.84rem; - line-height: 1.22; -} - -.release-delta__config-toolbar { - display: grid; - grid-template-columns: minmax(0, 1fr) auto; - align-items: center; - column-gap: 1.25rem; - row-gap: 0.5rem; - margin-top: 0.36rem; - padding: 0 0 0; -} - -.release-delta__config-summary { - max-width: 42rem; color: var(--ink-soft); - font-size: 0.96rem; - line-height: 1.64; + font-size: 0.86rem; + line-height: 1.55; } -.release-delta__config-actions { - display: flex; - align-items: center; - justify-content: flex-end; - gap: 0.85rem; +.release-delta__hero-link { justify-self: end; + white-space: nowrap; + font-size: 0.82rem; + line-height: 1.45; } -.release-delta__copy-button { - display: inline-flex; - align-items: center; - justify-content: flex-end; - min-width: 0; - border: 0; - border-radius: 0; - background: transparent; - padding: 0; - color: var(--muted); - font-size: 0.78rem; - font-weight: 600; - letter-spacing: 0.04em; - line-height: 1.22; - text-align: right; - text-transform: uppercase; - cursor: pointer; - transition: - color 140ms ease; +.release-delta__comparison { + display: grid; + gap: 0.85rem; } -.release-delta__config-toggle:hover, -.release-delta__copy-button:hover { - color: var(--link); +.release-delta__content-grid { + display: grid; + gap: 1rem; + padding-top: 0.8rem; + border-top: 1px solid var(--border); } -.release-delta__config-divider-toggle { +.release-delta__radar-strip { display: flex; align-items: center; width: 100%; - gap: 0; - border: 0; - background: transparent; - margin: -0.38rem 0 -0.34rem; - padding: 0.46rem 0 0.36rem; - color: var(--muted-soft); - cursor: pointer; - transition: color 140ms ease; + padding: 0.05rem 0 0.05rem; } -.release-delta__config-divider-toggle:hover { - color: var(--ink-soft); -} - -.release-delta__config-divider-rule { +.release-delta__radar-strip-line { position: relative; flex: 1 1 auto; height: 1px; background: color-mix(in srgb, var(--border) 84%, transparent); overflow: hidden; - transition: - height 180ms ease, - background 180ms ease, - box-shadow 180ms ease; } -.release-delta__config-divider-rule::after { +.release-delta__radar-strip-line::after { content: ""; position: absolute; inset: 0; @@ -1075,29 +971,15 @@ code { background-repeat: no-repeat; background-position: 200% 0; opacity: 0.82; - animation: release-delta-divider-shimmer 2.8s linear infinite; -} - -.release-delta__config-divider-toggle:hover .release-delta__config-divider-rule, -.release-delta__config-divider-toggle:focus-visible .release-delta__config-divider-rule { - height: 2px; - background: color-mix(in srgb, var(--accent) 26%, var(--border)); - box-shadow: 0 0 0.55rem color-mix(in srgb, var(--accent) 18%, transparent); -} - -.release-delta__config-divider-toggle:hover .release-delta__config-divider-rule::after, -.release-delta__config-divider-toggle:focus-visible .release-delta__config-divider-rule::after, -.release-delta__config-divider-toggle[aria-expanded="false"] .release-delta__config-divider-rule::after { - opacity: 1; - animation-duration: 1.5s; + animation: release-delta-radar-shimmer 2.8s linear infinite; } :root[data-theme="light"] { - .release-delta__config-divider-rule { + .release-delta__radar-strip-line { background: color-mix(in srgb, var(--accent) 56%, var(--border)); } - .release-delta__config-divider-rule::after { + .release-delta__radar-strip-line::after { background-image: linear-gradient( 90deg, transparent 0%, @@ -1112,22 +994,16 @@ code { ); opacity: 0.92; } - - .release-delta__config-divider-toggle:hover .release-delta__config-divider-rule, - .release-delta__config-divider-toggle:focus-visible .release-delta__config-divider-rule { - background: color-mix(in srgb, var(--link) 62%, var(--border)); - box-shadow: 0 0 0.65rem color-mix(in srgb, var(--link) 26%, transparent); - } } @media (prefers-color-scheme: light) { :root:not([data-theme]), :root[data-theme="system"] { - .release-delta__config-divider-rule { + .release-delta__radar-strip-line { background: color-mix(in srgb, var(--accent) 56%, var(--border)); } - .release-delta__config-divider-rule::after { + .release-delta__radar-strip-line::after { background-image: linear-gradient( 90deg, transparent 0%, @@ -1142,16 +1018,10 @@ code { ); opacity: 0.92; } - - .release-delta__config-divider-toggle:hover .release-delta__config-divider-rule, - .release-delta__config-divider-toggle:focus-visible .release-delta__config-divider-rule { - background: color-mix(in srgb, var(--link) 62%, var(--border)); - box-shadow: 0 0 0.65rem color-mix(in srgb, var(--link) 26%, transparent); - } } } -@keyframes release-delta-divider-shimmer { +@keyframes release-delta-radar-shimmer { 0% { background-position: 200% 0; } @@ -1161,179 +1031,66 @@ code { } } -.release-delta__config-table-shell { - overflow: hidden; - max-height: none; - opacity: 1; - transition: - max-height 260ms ease, - opacity 220ms ease; -} - -.release-delta__config-table-shell[data-collapsed="true"] { - opacity: 0; -} - -.release-delta__config-table { - width: 100%; - border-top: 0; - border-collapse: collapse; - table-layout: auto; -} - -.release-delta__config-table-head th { - padding: 0.22rem 0 0.38rem 0; - vertical-align: bottom; - text-align: left; -} - -.release-delta__config-table-label { - color: var(--muted-soft); - font-size: 0.66rem; - font-weight: 700; - letter-spacing: 0.12em; - line-height: 1.2; - text-transform: uppercase; -} - -.release-delta__config-col--feature, -.release-delta__config-col--ref { - width: 1%; - white-space: nowrap; -} - -.release-delta__config-table-head .release-delta__config-col--feature { - padding-right: 1.1rem; -} - -.release-delta__config-table-head .release-delta__config-col--ref { - padding-left: 1.1rem; -} - -.release-delta__config-item + .release-delta__config-item .release-delta__config-cell { - border-top: 1px solid var(--border); -} - -.release-delta__config-cell { - min-width: 0; - padding: 0.9rem 0; - vertical-align: top; -} - -.release-delta__config-cell--feature { - width: 19rem; - padding-right: 1.1rem; -} - -.release-delta__config-cell--ref { - width: 6.5rem; - padding-left: 1.1rem; - white-space: nowrap; +.release-delta__state { + display: grid; + gap: 0.6rem; + align-self: start; + padding-left: 1rem; + border-left: 1px solid var(--border); } -.release-delta__config-cell > * { +.release-delta__state-list { + display: grid; + gap: 0; margin: 0; } -.release-delta__config-cell > * + * { - margin-top: 0.32rem; +.release-delta__state-row { + display: grid; + grid-template-columns: minmax(0, 1fr) auto; + align-items: baseline; + gap: 0.75rem; + padding: 0.38rem 0; + border-bottom: 1px solid var(--border); } -.release-delta__config-primary { - width: fit-content; - max-width: 100%; - border: 1px solid var(--border); - border-radius: 0.68rem; - background: color-mix(in srgb, var(--bg-soft) 82%, var(--panel)); - padding: 0.34rem 0.58rem; - color: var(--ink); +.release-delta__state-row dt { + color: var(--muted); font-size: 0.78rem; line-height: 1.45; - overflow-wrap: anywhere; -} - -.release-delta__config-meta { - display: flex; - flex-wrap: nowrap; - align-items: center; - gap: 0.42rem; - min-width: 0; } -.release-delta__config-meta-label { - display: inline-block; - width: 4.6ch; - flex: 0 0 4.6ch; - text-align: right; - white-space: nowrap; - color: var(--muted-soft); - font-size: 0.62rem; - font-weight: 700; - letter-spacing: 0.1em; +.release-delta__state-row dd { + margin: 0; + color: var(--ink); + font-size: 1rem; + font-weight: 800; line-height: 1.2; - text-transform: uppercase; -} - -.release-delta__config-meta-code { - color: var(--muted); - font-size: 0.72rem; - line-height: 1.45; - white-space: nowrap; -} - -.release-delta__config-cli, -.release-delta__config-inline-link { - color: var(--muted); - font-size: 0.74rem; - line-height: 1.45; } -.release-delta__config-item-copy { +.release-delta__state-copy { + margin: 0; color: var(--ink-soft); - font-size: 0.86rem; - line-height: 1.56; -} - -.release-delta__config-item-note { - color: var(--muted); - font-size: 0.8rem; - line-height: 1.55; -} - -.release-delta__config-item-note-label { - margin-right: 0.35rem; - color: var(--muted-soft); - font-size: 0.68rem; - font-weight: 700; - letter-spacing: 0.08em; - text-transform: uppercase; -} - -.release-delta__config-item-links { - color: var(--muted); font-size: 0.78rem; - line-height: 1.5; - width: fit-content; - white-space: nowrap; + line-height: 1.55; } .release-delta__overview { display: grid; - gap: 0.85rem; + gap: 0.62rem; padding: 0; } .release-delta__overview-head { display: grid; - gap: 0.3rem; - padding-bottom: 0.2rem; + gap: 0.22rem; } .release-delta__overview-title { font-size: 1rem; font-weight: 800; line-height: 1.22; - letter-spacing: -0.03em; + letter-spacing: 0; color: var(--ink); } @@ -1431,17 +1188,15 @@ code { .release-delta__summary-rail { display: flex; flex-wrap: wrap; - gap: 0.72rem 1.3rem; + gap: 0.55rem 1.25rem; align-items: center; - padding: 0.45rem 0 0.8rem; - border-top: 1px solid var(--border); - border-bottom: 1px solid var(--border); + padding: 0; + border: 0; } .release-delta__summary-rail--hero { - padding: 0.2rem 0 0.75rem; - border-top: 0; - border-bottom: 1px solid var(--border); + padding: 0; + border: 0; } .release-delta__summary-item { @@ -1454,17 +1209,11 @@ code { white-space: nowrap; } -.release-delta__summary-item--pair { - display: inline-flex; - align-items: center; - min-width: 0; -} - .release-delta__summary-item strong { color: var(--ink); font-size: 1rem; font-weight: 800; - letter-spacing: -0.03em; + letter-spacing: 0; } .release-delta__panel-label { @@ -1481,14 +1230,6 @@ code { color: var(--muted); } -.release-delta__summary-link { - margin-left: auto; - padding-left: 0.2rem; - font-size: 0.82rem; - line-height: 1.4; - white-space: nowrap; -} - .sr-only { position: absolute; width: 1px; @@ -1937,22 +1678,18 @@ code { .release-delta { margin-top: 1.1rem; - padding: 1.25rem; + padding: 1.05rem 0; } .release-delta__hero-head { - grid-template-columns: minmax(0, 1fr); + grid-template-columns: minmax(0, 1fr) auto; } .release-delta__content-grid { - grid-template-columns: minmax(0, 1fr); + grid-template-columns: minmax(0, 1fr) 15rem; align-items: start; } - .release-delta__config-cell--feature { - width: 18rem; - } - .feed-toolbar { flex-direction: row; align-items: center; @@ -2044,46 +1781,18 @@ code { grid-template-columns: minmax(0, 1fr); } - .release-delta__config-toolbar { + .release-delta__hero-head { grid-template-columns: minmax(0, 1fr); - align-items: stretch; } - .release-delta__config-actions { + .release-delta__hero-link { justify-self: start; - justify-content: flex-start; - } - - .release-delta__config-table, - .release-delta__config-table-head, - .release-delta__config-list, - .release-delta__config-item, - .release-delta__config-cell { - display: block; - width: 100%; - } - - .release-delta__config-table-head { - display: none; - } - - .release-delta__config-item { - padding: 0.9rem 0; - } - - .release-delta__config-cell { - padding: 0; - border-top: 0; - } - - .release-delta__config-cell + .release-delta__config-cell { - margin-top: 0.7rem; } - .release-delta__config-cell--feature, - .release-delta__config-cell--ref { - width: auto; + .release-delta__state { + padding-top: 0.85rem; padding-left: 0; - padding-right: 0; + border-top: 1px solid var(--border); + border-left: 0; } } From 895ee8b0becb00b3e29c1e3f4fb1a81cabb7bd3d Mon Sep 17 00:00:00 2001 From: Yvette Carlisle Date: Wed, 13 May 2026 17:16:43 +0800 Subject: [PATCH 02/12] {"schema":"decodex/commit/1","summary":"Remove duplicate site dividers","authority":"manual"} --- site/src/styles/global.css | 31 ++++++++++--------------------- 1 file changed, 10 insertions(+), 21 deletions(-) diff --git a/site/src/styles/global.css b/site/src/styles/global.css index f77dd6d1..a17d543e 100644 --- a/site/src/styles/global.css +++ b/site/src/styles/global.css @@ -840,11 +840,9 @@ code { .release-delta { display: grid; - gap: 0.9rem; - margin-top: 1.2rem; - padding: 1.05rem 0 1.05rem; - border-top: 1px solid var(--border); - border-bottom: 1px solid var(--border); + gap: 1rem; + margin-top: 1.1rem; + padding: 0.95rem 0 0.85rem; background: transparent; } @@ -934,15 +932,14 @@ code { .release-delta__content-grid { display: grid; gap: 1rem; - padding-top: 0.8rem; - border-top: 1px solid var(--border); + padding-top: 0.2rem; } .release-delta__radar-strip { display: flex; align-items: center; width: 100%; - padding: 0.05rem 0 0.05rem; + padding: 0.18rem 0 0.08rem; } .release-delta__radar-strip-line { @@ -1248,10 +1245,9 @@ code { gap: 0.9rem; align-items: flex-start; justify-content: space-between; - margin-top: 1.2rem; - padding: 0.95rem 0 0.85rem; + margin-top: 1rem; + padding: 0.95rem 0 0.2rem; border-top: 1px solid var(--border); - border-bottom: 1px solid var(--border); } .feed-toolbar__intro { @@ -1315,7 +1311,7 @@ code { } .feed-region { - margin-top: 1rem; + margin-top: 0.75rem; display: flex; flex-direction: column; gap: 1.8rem; @@ -1346,14 +1342,7 @@ code { .feed-group__label { display: flex; align-items: center; - gap: 0.85rem; -} - -.feed-group__label::after { - flex: 1; - height: 1px; - background: var(--border); - content: ""; + gap: 0; } .feed-group__label span { @@ -1678,7 +1667,7 @@ code { .release-delta { margin-top: 1.1rem; - padding: 1.05rem 0; + padding: 0.95rem 0 0.85rem; } .release-delta__hero-head { From 9a5083152675c470d58e7764396e15343bb44659 Mon Sep 17 00:00:00 2001 From: Yvette Carlisle Date: Wed, 13 May 2026 17:29:23 +0800 Subject: [PATCH 03/12] {"schema":"decodex/commit/1","summary":"Align site typography and grid","authority":"manual"} --- site/src/styles/global.css | 496 ++++++++++++++++++++----------------- 1 file changed, 271 insertions(+), 225 deletions(-) diff --git a/site/src/styles/global.css b/site/src/styles/global.css index a17d543e..6cf298af 100644 --- a/site/src/styles/global.css +++ b/site/src/styles/global.css @@ -2,6 +2,13 @@ :root, :root[data-theme="light"] { + --font-sans: "Inter", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; + --font-display: "Inter", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; + --font-mono: "SFMono-Regular", "SF Mono", ui-monospace, Menlo, Monaco, monospace; + --rail-width: 9.5rem; + --content-gap: 1.85rem; + --measure: 45rem; + --label-size: 0.68rem; --bg: #f7f8fc; --bg-soft: #eef1f7; --bg-subtle: #e6e9f2; @@ -26,49 +33,49 @@ @media (prefers-color-scheme: dark) { :root:not([data-theme]), :root[data-theme="system"] { - --bg: #1a1b26; - --bg-soft: #1f2335; - --bg-subtle: #24283b; - --panel: #1f2335; - --ink: #c0caf5; - --ink-soft: #a9b1d6; - --muted: #7a849e; - --muted-soft: #565f89; - --border: #2f3549; - --border-strong: #414868; - --accent: #7aa2f7; - --accent-soft: #1b2440; - --link: #7aa2f7; + --bg: #181a21; + --bg-soft: #20232d; + --bg-subtle: #262a36; + --panel: #20232d; + --ink: #d9def0; + --ink-soft: #b4bdd3; + --muted: #7e879d; + --muted-soft: #636c83; + --border: #303545; + --border-strong: #434a60; + --accent: #82aaff; + --accent-soft: #202b43; + --link: #90b4ff; --success: #9ece6a; --success-soft: #223128; --success-border: #364a30; - --code-bg: #24283b; - --code-border: #414868; - --link-underline: #414868; + --code-bg: #252c3d; + --code-border: #3d4964; + --link-underline: #46516a; } } :root[data-theme="dark"] { color-scheme: dark; - --bg: #1a1b26; - --bg-soft: #1f2335; - --bg-subtle: #24283b; - --panel: #1f2335; - --ink: #c0caf5; - --ink-soft: #a9b1d6; - --muted: #7a849e; - --muted-soft: #565f89; - --border: #2f3549; - --border-strong: #414868; - --accent: #7aa2f7; - --accent-soft: #1b2440; - --link: #7aa2f7; + --bg: #181a21; + --bg-soft: #20232d; + --bg-subtle: #262a36; + --panel: #20232d; + --ink: #d9def0; + --ink-soft: #b4bdd3; + --muted: #7e879d; + --muted-soft: #636c83; + --border: #303545; + --border-strong: #434a60; + --accent: #82aaff; + --accent-soft: #202b43; + --link: #90b4ff; --success: #9ece6a; --success-soft: #223128; --success-border: #364a30; - --code-bg: #24283b; - --code-border: #414868; - --link-underline: #414868; + --code-bg: #252c3d; + --code-border: #3d4964; + --link-underline: #46516a; } :root[data-theme="light"] { @@ -104,13 +111,11 @@ body { margin: 0; background: var(--bg); color: var(--ink); - font-family: - ui-sans-serif, - -apple-system, - BlinkMacSystemFont, - "Segoe UI", - sans-serif; + font-family: var(--font-sans); + font-size: 16px; + line-height: 1.55; text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; transition: background-color 180ms ease, color 180ms ease, @@ -124,7 +129,8 @@ h4, h5, h6 { margin: 0; - font-weight: 800; + font-family: var(--font-display); + font-weight: 750; letter-spacing: 0; } @@ -141,12 +147,7 @@ a { } code { - font-family: - ui-monospace, - "SFMono-Regular", - Menlo, - Monaco, - monospace; + font-family: var(--font-mono); } .site-shell { @@ -155,23 +156,23 @@ code { .site-frame { width: 100%; - max-width: 72rem; + max-width: 71.5rem; min-height: 100vh; margin: 0 auto; - padding: 1.25rem 1.1rem 5rem; + padding: 1.35rem 1.15rem 5rem; } .site-topbar { display: flex; flex-direction: column; - gap: 0.95rem; - padding-bottom: 1.15rem; + gap: 1rem; + padding-bottom: 1.05rem; border-bottom: 1px solid var(--border); } .site-topbar__head { display: grid; - gap: 0.54rem; + gap: 0.72rem 1.75rem; } .site-head__logo, @@ -249,13 +250,13 @@ code { .site-brand__wordmark-image { display: block; width: auto; - height: 3rem; + height: 3.08rem; } .site-brand__note { max-width: 35rem; - font-size: 0.94rem; - line-height: 1.5; + font-size: 0.95rem; + line-height: 1.48; color: var(--ink-soft); } @@ -284,20 +285,15 @@ code { display: inline-flex; align-items: center; gap: 0.4rem; - padding: 0.34rem 0.66rem; + padding: 0.32rem 0.62rem; border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--border)); border-radius: 999px; background: color-mix(in srgb, var(--accent-soft) 78%, var(--panel)); color: var(--muted); - font-family: - ui-monospace, - "SFMono-Regular", - Menlo, - Monaco, - monospace; - font-size: 0.66rem; + font-family: var(--font-mono); + font-size: 0.64rem; font-weight: 700; - letter-spacing: 0.06em; + letter-spacing: 0.05em; line-height: 1.1; min-height: 1.5rem; } @@ -326,10 +322,10 @@ code { .site-brand__social { display: grid; align-content: center; - align-self: stretch; + align-self: start; gap: 0.16rem; width: fit-content; - height: 100%; + height: auto; color: var(--ink-soft); transition: color 160ms ease; } @@ -339,7 +335,7 @@ code { } .site-brand__social-handle { - font-size: 0.92rem; + font-size: 0.9rem; font-weight: 700; letter-spacing: 0; color: var(--accent); @@ -347,8 +343,8 @@ code { .site-brand__social-copy { max-width: 18rem; - font-size: 0.73rem; - line-height: 1.35; + font-size: 0.76rem; + line-height: 1.42; color: var(--muted); } @@ -387,12 +383,7 @@ code { .release-highlight__try-label, .signal-source-timeline__kind, .signal-source-timeline__meta { - font-family: - ui-monospace, - "SFMono-Regular", - Menlo, - Monaco, - monospace; + font-family: var(--font-sans); } .theme-toggle { @@ -414,16 +405,11 @@ code { color: var(--muted); padding: 0.3rem 0.66rem; font: inherit; - font-size: 0.66rem; + font-size: 0.64rem; font-weight: 700; - letter-spacing: 0.06em; + letter-spacing: 0.05em; line-height: 1.1; - font-family: - ui-monospace, - "SFMono-Regular", - Menlo, - Monaco, - monospace; + font-family: var(--font-mono); text-transform: uppercase; cursor: pointer; transition: @@ -480,12 +466,7 @@ code { .appcast-download__eyebrow, .appcast-download__version-meta { - font-family: - ui-monospace, - "SFMono-Regular", - Menlo, - Monaco, - monospace; + font-family: var(--font-mono); } .appcast-download__kicker { @@ -504,8 +485,8 @@ code { } .appcast-download__title { - font-size: 0.86rem; - font-weight: 800; + font-size: 0.88rem; + font-weight: 750; letter-spacing: 0; line-height: 1; color: var(--ink); @@ -638,7 +619,7 @@ code { width: fit-content; max-width: 100%; min-width: 0; - font-size: 0.94rem; + font-size: 0.9rem; line-height: 1.45; color: var(--muted); } @@ -646,8 +627,8 @@ code { .reset-inline__question { min-width: 0; color: var(--ink); - font-size: 0.86rem; - font-weight: 800; + font-size: 0.88rem; + font-weight: 750; letter-spacing: 0; line-height: 1.1; } @@ -660,8 +641,8 @@ code { padding: 0; border: 0; background: none; - font-size: 0.86rem; - font-weight: 800; + font-size: 0.88rem; + font-weight: 750; letter-spacing: 0; color: var(--ink); white-space: nowrap; @@ -840,9 +821,9 @@ code { .release-delta { display: grid; - gap: 1rem; - margin-top: 1.1rem; - padding: 0.95rem 0 0.85rem; + gap: 0.95rem; + margin-top: 1.2rem; + padding: 1rem 0 0.95rem; background: transparent; } @@ -851,33 +832,33 @@ code { flex-wrap: wrap; align-items: center; justify-content: space-between; - gap: 0.5rem 1rem; + gap: 0.55rem var(--content-gap); padding-bottom: 0.15rem; } .release-delta__hero { display: grid; - gap: 0.7rem; + gap: 0.78rem; padding: 0; } .release-delta__hero-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; - gap: 0.9rem 1.5rem; + gap: 0.75rem var(--content-gap); align-items: start; } .release-delta__hero-copy { display: grid; - gap: 0.42rem; + gap: 0.38rem; } .release-delta__eyebrow { color: var(--muted-soft); - font-size: 0.7rem; - font-weight: 700; - letter-spacing: 0.12em; + font-size: var(--label-size); + font-weight: 720; + letter-spacing: 0.09em; line-height: 1.2; text-transform: uppercase; } @@ -889,49 +870,50 @@ code { justify-content: flex-end; gap: 0.32rem; color: var(--muted); - font-size: 0.86rem; - line-height: 1.45; + font-size: 0.88rem; + line-height: 1.35; } .release-delta__window-label strong { color: var(--ink); - font-size: 0.95rem; - font-weight: 800; + font-size: 0.98rem; + font-weight: 760; letter-spacing: 0; } .release-delta__title { margin: 0; color: var(--ink); - font-size: 1.18rem; - font-weight: 850; + font-size: 1.26rem; + font-weight: 760; letter-spacing: 0; - line-height: 1.2; + line-height: 1.18; } .release-delta__hero-subcopy { - max-width: 46rem; + max-width: var(--measure); margin: 0; color: var(--ink-soft); - font-size: 0.86rem; - line-height: 1.55; + font-size: 0.93rem; + line-height: 1.56; } .release-delta__hero-link { justify-self: end; white-space: nowrap; - font-size: 0.82rem; + padding-top: 1.62rem; + font-size: 0.86rem; line-height: 1.45; } .release-delta__comparison { display: grid; - gap: 0.85rem; + gap: 0.9rem; } .release-delta__content-grid { display: grid; - gap: 1rem; + gap: var(--content-gap); padding-top: 0.2rem; } @@ -1030,9 +1012,9 @@ code { .release-delta__state { display: grid; - gap: 0.6rem; + gap: 0.68rem; align-self: start; - padding-left: 1rem; + padding-left: 1.15rem; border-left: 1px solid var(--border); } @@ -1046,35 +1028,35 @@ code { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; - gap: 0.75rem; - padding: 0.38rem 0; + gap: 0.9rem; + padding: 0.42rem 0; border-bottom: 1px solid var(--border); } .release-delta__state-row dt { color: var(--muted); - font-size: 0.78rem; + font-size: 0.82rem; line-height: 1.45; } .release-delta__state-row dd { margin: 0; color: var(--ink); - font-size: 1rem; - font-weight: 800; + font-size: 1.04rem; + font-weight: 760; line-height: 1.2; } .release-delta__state-copy { margin: 0; color: var(--ink-soft); - font-size: 0.78rem; - line-height: 1.55; + font-size: 0.82rem; + line-height: 1.58; } .release-delta__overview { display: grid; - gap: 0.62rem; + gap: 0.72rem; padding: 0; } @@ -1083,9 +1065,16 @@ code { gap: 0.22rem; } +.release-delta__overview-head > div { + display: grid; + grid-template-columns: minmax(6.75rem, var(--rail-width)) minmax(0, 1fr); + column-gap: var(--content-gap); + align-items: baseline; +} + .release-delta__overview-title { - font-size: 1rem; - font-weight: 800; + font-size: 1.04rem; + font-weight: 760; line-height: 1.22; letter-spacing: 0; color: var(--ink); @@ -1093,7 +1082,7 @@ code { .release-delta__overview-list { display: grid; - gap: 0.75rem; + gap: 0.95rem; margin: 0; padding: 0; list-style: none; @@ -1102,7 +1091,7 @@ code { .release-overview-card { display: grid; gap: 0.7rem; - padding-top: 0.9rem; + padding-top: 1rem; border-top: 1px solid var(--border); } @@ -1118,23 +1107,33 @@ code { .release-overview-card__body { display: grid; - gap: 0.4rem; + grid-template-columns: minmax(6.75rem, var(--rail-width)) minmax(0, 1fr); + grid-template-areas: + "meta title" + ". why" + ". details" + ". action"; + column-gap: var(--content-gap); + row-gap: 0.42rem; min-width: 0; } .release-overview-card__meta { + grid-area: meta; + padding-top: 0.14rem; color: var(--muted-soft); - font-size: 0.66rem; - font-weight: 700; - letter-spacing: 0.12em; + font-size: var(--label-size); + font-weight: 720; + letter-spacing: 0.09em; text-transform: uppercase; } .release-overview-card__title { + grid-area: title; width: fit-content; color: var(--ink); - font-size: 1rem; - line-height: 1.26; + font-size: 1.04rem; + line-height: 1.28; } .release-overview-card__title:hover { @@ -1142,17 +1141,19 @@ code { } .release-overview-card__why { - max-width: 42rem; + grid-area: why; + max-width: var(--measure); color: var(--ink-soft); - font-size: 0.88rem; + font-size: 0.91rem; line-height: 1.58; } .release-overview-card__details { + grid-area: details; display: grid; - gap: 0.85rem 1.35rem; + gap: 0.85rem 1.5rem; grid-template-columns: repeat(2, minmax(0, 1fr)); - padding-top: 0.1rem; + padding-top: 0.18rem; } .release-overview-card__detail { @@ -1163,29 +1164,30 @@ code { .release-overview-card__label { color: var(--muted-soft); - font-size: 0.66rem; - font-weight: 700; - letter-spacing: 0.12em; + font-size: var(--label-size); + font-weight: 720; + letter-spacing: 0.09em; text-transform: uppercase; } .release-overview-card__detail-body { color: var(--ink-soft); - font-size: 0.85rem; + font-size: 0.88rem; line-height: 1.58; } .release-overview-card__action { + grid-area: action; width: fit-content; - margin-top: 0.2rem; - font-size: 0.84rem; + margin-top: 0.12rem; + font-size: 0.86rem; line-height: 1.45; } .release-delta__summary-rail { display: flex; flex-wrap: wrap; - gap: 0.55rem 1.25rem; + gap: 0.55rem 1.35rem; align-items: center; padding: 0; border: 0; @@ -1201,23 +1203,23 @@ code { align-items: center; gap: 0.25rem; color: var(--muted); - font-size: 0.88rem; - line-height: 1.5; + font-size: 0.9rem; + line-height: 1.45; white-space: nowrap; } .release-delta__summary-item strong { color: var(--ink); - font-size: 1rem; - font-weight: 800; + font-size: 1.04rem; + font-weight: 760; letter-spacing: 0; } .release-delta__panel-label { color: var(--muted-soft); - font-size: 0.66rem; - font-weight: 700; - letter-spacing: 0.12em; + font-size: var(--label-size); + font-weight: 720; + letter-spacing: 0.09em; text-transform: uppercase; } @@ -1240,21 +1242,18 @@ code { } .feed-toolbar { - display: flex; - flex-direction: column; - gap: 0.9rem; + display: grid; + gap: 0.9rem var(--content-gap); align-items: flex-start; - justify-content: space-between; margin-top: 1rem; padding: 0.95rem 0 0.2rem; border-top: 1px solid var(--border); } .feed-toolbar__intro { - display: flex; - flex-direction: column; - gap: 0.5rem; - align-items: flex-start; + display: grid; + gap: 0.45rem var(--content-gap); + align-items: start; } .feed-toolbar__controls { @@ -1268,16 +1267,16 @@ code { display: flex; flex-wrap: wrap; align-items: center; - gap: 0.45rem 1.25rem; + gap: 0.45rem 1.15rem; } .filter-chip { border-bottom: 2px solid transparent; padding: 0 0 0.5rem; color: var(--muted); - font-size: 0.68rem; + font-size: var(--label-size); font-weight: 700; - letter-spacing: 0.14em; + letter-spacing: 0.1em; text-transform: uppercase; transition: color 160ms ease, @@ -1297,16 +1296,16 @@ code { .feed-toolbar__label { color: var(--muted); - font-size: 0.7rem; - font-weight: 600; - letter-spacing: 0.12em; + font-size: var(--label-size); + font-weight: 720; + letter-spacing: 0.09em; text-transform: uppercase; } .feed-toolbar__summary { - max-width: 42rem; + max-width: var(--measure); color: var(--ink-soft); - font-size: 0.88rem; + font-size: 0.92rem; line-height: 1.55; } @@ -1347,16 +1346,16 @@ code { .feed-group__label span { color: var(--muted-soft); - font-size: 0.68rem; - font-weight: 700; - letter-spacing: 0.12em; + font-size: var(--label-size); + font-weight: 720; + letter-spacing: 0.09em; text-transform: uppercase; } .signal-card { display: grid; - gap: 0.9rem; - padding: 1.15rem 0; + gap: 0.85rem var(--content-gap); + padding: 1.2rem 0; border-top: 1px solid var(--border); scroll-margin-top: 1.5rem; transition: @@ -1394,28 +1393,28 @@ code { .signal-entry__rail { display: flex; flex-direction: column; - gap: 0.55rem; + gap: 0.5rem; } .signal-entry-date { color: var(--muted); - font-size: 0.68rem; - font-weight: 600; - letter-spacing: 0.12em; + font-size: var(--label-size); + font-weight: 720; + letter-spacing: 0.09em; text-transform: uppercase; } .signal-entry__taxonomy { display: flex; flex-wrap: wrap; - gap: 0.4rem; + gap: 0.36rem; } .signal-entry__taxonomy-item { color: var(--muted-soft); - font-size: 0.68rem; - font-weight: 600; - letter-spacing: 0.08em; + font-size: var(--label-size); + font-weight: 650; + letter-spacing: 0.06em; text-transform: uppercase; } @@ -1429,41 +1428,42 @@ code { .signal-entry__preview { color: var(--link); - font-size: 0.68rem; + font-size: var(--label-size); font-weight: 700; - letter-spacing: 0.12em; + letter-spacing: 0.09em; text-transform: uppercase; } .signal-entry__title { max-width: 48rem; - font-size: 1.35rem; - line-height: 1.14; + font-size: 1.22rem; + font-weight: 760; + line-height: 1.22; color: var(--ink); } .signal-entry__summary { - max-width: 46rem; - font-size: 0.95rem; - line-height: 1.68; + max-width: var(--measure); + font-size: 0.94rem; + line-height: 1.62; color: var(--ink-soft); } .signal-entry__why { display: flex; flex-direction: column; - gap: 0.28rem; - max-width: 46rem; - font-size: 0.92rem; - line-height: 1.65; + gap: 0.3rem; + max-width: var(--measure); + font-size: 0.91rem; + line-height: 1.62; color: var(--ink); } .signal-entry-label { color: var(--muted-soft); - font-size: 0.66rem; - font-weight: 700; - letter-spacing: 0.12em; + font-size: var(--label-size); + font-weight: 720; + letter-spacing: 0.09em; text-transform: uppercase; } @@ -1475,15 +1475,16 @@ code { .signal-entry-action__row, .signal-entry-action__effect { - display: flex; - flex-direction: column; - gap: 0.28rem; + display: grid; + grid-template-columns: minmax(6.75rem, var(--rail-width)) minmax(0, 1fr); + gap: 0.28rem var(--content-gap); + align-items: start; } .signal-entry-action__row { color: var(--ink); - font-size: 0.92rem; - line-height: 1.65; + font-size: 0.91rem; + line-height: 1.62; } .signal-entry-action__body { @@ -1493,7 +1494,7 @@ code { .signal-entry-action__effect { margin-top: 0.6rem; color: var(--muted); - font-size: 0.88rem; + font-size: 0.89rem; line-height: 1.58; } @@ -1516,12 +1517,7 @@ code { background: var(--success-soft); padding: 0.12rem 0.45rem; color: var(--success); - font-family: - ui-monospace, - "SFMono-Regular", - Menlo, - Monaco, - monospace; + font-family: var(--font-mono); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.04em; @@ -1617,7 +1613,7 @@ code { @media (min-width: 768px) { .site-frame { - padding: 1.45rem 1.5rem 5.5rem; + padding: 1.45rem 1.55rem 5.5rem; } .site-topbar { @@ -1625,13 +1621,42 @@ code { } .site-topbar__head { - grid-template-columns: repeat(2, minmax(0, 1fr)); - align-items: stretch; - column-gap: 2rem; + grid-template-columns: minmax(0, 1fr) minmax(18rem, 23rem); + grid-template-areas: + "logo utility" + "note status" + "social actions"; + align-items: start; + column-gap: 2.25rem; + row-gap: 0.65rem; + } + + .site-head__logo { + grid-area: logo; + } + + .site-head__utility { + grid-area: utility; + } + + .site-brand__note { + grid-area: note; + } + + .site-head__status { + grid-area: status; + } + + .site-brand__social { + grid-area: social; + } + + .site-head__actions { + grid-area: actions; } .site-brand__wordmark-image { - height: 3.35rem; + height: 3.22rem; } .site-brand__meta { @@ -1640,7 +1665,7 @@ code { } .site-brand__note { - max-width: 40rem; + max-width: var(--measure); } .site-brand__social { @@ -1653,12 +1678,13 @@ code { } .site-head__utility { - min-height: 3.35rem; + min-height: 3.22rem; align-content: space-between; justify-items: end; } .site-head__actions { + align-items: flex-start; } .site-brand__cues { @@ -1675,19 +1701,18 @@ code { } .release-delta__content-grid { - grid-template-columns: minmax(0, 1fr) 15rem; + grid-template-columns: minmax(0, 1fr) 14.75rem; align-items: start; } .feed-toolbar { - flex-direction: row; - align-items: center; + grid-template-columns: minmax(0, 1fr) auto; + align-items: start; } .feed-toolbar__intro { - flex-direction: row; - align-items: center; - gap: 0.8rem; + grid-template-columns: minmax(6.75rem, var(--rail-width)) minmax(0, var(--measure)); + align-items: start; } .feed-toolbar__controls { @@ -1697,8 +1722,7 @@ code { } .signal-card { - grid-template-columns: 9.25rem minmax(0, 1fr); - gap: 1.75rem; + grid-template-columns: var(--rail-width) minmax(0, 1fr); } .signal-entry__taxonomy { @@ -1770,12 +1794,29 @@ code { grid-template-columns: minmax(0, 1fr); } + .release-overview-card__body { + grid-template-columns: minmax(0, 1fr); + grid-template-areas: + "meta" + "title" + "why" + "details" + "action"; + row-gap: 0.4rem; + } + + .release-delta__overview-head > div { + grid-template-columns: minmax(0, 1fr); + row-gap: 0.22rem; + } + .release-delta__hero-head { grid-template-columns: minmax(0, 1fr); } .release-delta__hero-link { justify-self: start; + padding-top: 0; } .release-delta__state { @@ -1784,4 +1825,9 @@ code { border-top: 1px solid var(--border); border-left: 0; } + + .signal-entry-action__row, + .signal-entry-action__effect { + grid-template-columns: minmax(0, 1fr); + } } From 13a3faa56ecda3cd5e0c60878193a76647f6719f Mon Sep 17 00:00:00 2001 From: Yvette Carlisle Date: Wed, 13 May 2026 19:36:32 +0800 Subject: [PATCH 04/12] {"schema":"decodex/commit/1","summary":"Tune site type scale","authority":"manual"} --- site/src/styles/global.css | 52 +++++++++++++++++++------------------- 1 file changed, 26 insertions(+), 26 deletions(-) diff --git a/site/src/styles/global.css b/site/src/styles/global.css index 6cf298af..112ed726 100644 --- a/site/src/styles/global.css +++ b/site/src/styles/global.css @@ -250,7 +250,7 @@ code { .site-brand__wordmark-image { display: block; width: auto; - height: 3.08rem; + height: 2.58rem; } .site-brand__note { @@ -485,8 +485,8 @@ code { } .appcast-download__title { - font-size: 0.88rem; - font-weight: 750; + font-size: 0.8rem; + font-weight: 680; letter-spacing: 0; line-height: 1; color: var(--ink); @@ -627,8 +627,8 @@ code { .reset-inline__question { min-width: 0; color: var(--ink); - font-size: 0.88rem; - font-weight: 750; + font-size: 0.82rem; + font-weight: 680; letter-spacing: 0; line-height: 1.1; } @@ -641,8 +641,8 @@ code { padding: 0; border: 0; background: none; - font-size: 0.88rem; - font-weight: 750; + font-size: 0.82rem; + font-weight: 680; letter-spacing: 0; color: var(--ink); white-space: nowrap; @@ -870,24 +870,24 @@ code { justify-content: flex-end; gap: 0.32rem; color: var(--muted); - font-size: 0.88rem; + font-size: 0.82rem; line-height: 1.35; } .release-delta__window-label strong { color: var(--ink); - font-size: 0.98rem; - font-weight: 760; + font-size: 0.86rem; + font-weight: 680; letter-spacing: 0; } .release-delta__title { margin: 0; color: var(--ink); - font-size: 1.26rem; - font-weight: 760; + font-size: 1.1rem; + font-weight: 700; letter-spacing: 0; - line-height: 1.18; + line-height: 1.22; } .release-delta__hero-subcopy { @@ -1041,9 +1041,9 @@ code { .release-delta__state-row dd { margin: 0; - color: var(--ink); - font-size: 1.04rem; - font-weight: 760; + color: var(--ink-soft); + font-size: 0.82rem; + font-weight: 620; line-height: 1.2; } @@ -1073,8 +1073,8 @@ code { } .release-delta__overview-title { - font-size: 1.04rem; - font-weight: 760; + font-size: 0.94rem; + font-weight: 700; line-height: 1.22; letter-spacing: 0; color: var(--ink); @@ -1132,7 +1132,7 @@ code { grid-area: title; width: fit-content; color: var(--ink); - font-size: 1.04rem; + font-size: 0.95rem; line-height: 1.28; } @@ -1203,15 +1203,15 @@ code { align-items: center; gap: 0.25rem; color: var(--muted); - font-size: 0.9rem; + font-size: 0.84rem; line-height: 1.45; white-space: nowrap; } .release-delta__summary-item strong { - color: var(--ink); - font-size: 1.04rem; - font-weight: 760; + color: var(--ink-soft); + font-size: inherit; + font-weight: 620; letter-spacing: 0; } @@ -1436,8 +1436,8 @@ code { .signal-entry__title { max-width: 48rem; - font-size: 1.22rem; - font-weight: 760; + font-size: 1.08rem; + font-weight: 700; line-height: 1.22; color: var(--ink); } @@ -1656,7 +1656,7 @@ code { } .site-brand__wordmark-image { - height: 3.22rem; + height: 2.72rem; } .site-brand__meta { From 8b76fc05c61362712bff7efef813398722f3e88e Mon Sep 17 00:00:00 2001 From: Yvette Carlisle Date: Wed, 13 May 2026 19:43:25 +0800 Subject: [PATCH 05/12] {"schema":"decodex/commit/1","summary":"Compact release checkpoint header","authority":"manual"} --- site/src/components/ReleaseDeltaPanel.astro | 10 +++--- site/src/styles/global.css | 34 ++++++++------------- 2 files changed, 18 insertions(+), 26 deletions(-) diff --git a/site/src/components/ReleaseDeltaPanel.astro b/site/src/components/ReleaseDeltaPanel.astro index 495424aa..20126f7b 100644 --- a/site/src/components/ReleaseDeltaPanel.astro +++ b/site/src/components/ReleaseDeltaPanel.astro @@ -60,11 +60,14 @@ const tryPathCount = trackedSignals.filter(hasConcreteTryPath).length; {releaseLabel(activePreview, delta.tag_prefix)} + + Open GitHub compare +
-
-
+
+

Continuous radar

Codex upstream signal room @@ -73,9 +76,6 @@ const tryPathCount = trackedSignals.filter(hasConcreteTryPath).length; Release tags are checkpoints. The feed is driven by commit and PR evidence that may affect Decodex or the public Codex workflow.

- - Open GitHub compare -
@@ -102,9 +99,9 @@ const tryPathCount = trackedSignals.filter(hasConcreteTryPath).length;
-

Current signals

+

Start here

- {publicHighlightSignals.length > 0 ? "Signals ready to try" : "No action-worthy signal yet"} + {publicHighlightSignals.length > 0 ? "Try these first" : "No action-worthy signal yet"}

@@ -157,24 +154,15 @@ const tryPathCount = trackedSignals.filter(hasConcreteTryPath).length; ) }
-
diff --git a/site/src/lib/signal-feed.ts b/site/src/lib/signal-feed.ts index c18d8c26..d9c37924 100644 --- a/site/src/lib/signal-feed.ts +++ b/site/src/lib/signal-feed.ts @@ -6,8 +6,8 @@ export const FILTERS = [ }, { id: "github", - label: "GitHub", - description: "PR-first GitHub change signals.", + label: "Upstream", + description: "Source-backed upstream change signals.", }, { id: "try-now", diff --git a/site/src/pages/index.astro b/site/src/pages/index.astro index 92802149..0f28d8c5 100644 --- a/site/src/pages/index.astro +++ b/site/src/pages/index.astro @@ -1,10 +1,8 @@ --- import { getCollection } from "astro:content"; import EmptyFeedState from "@/components/EmptyFeedState.astro"; -import AppcastDownloadWidget from "@/components/AppcastDownloadWidget.astro"; import FilterBar from "@/components/FilterBar.astro"; import ReleaseDeltaPanel from "@/components/ReleaseDeltaPanel.astro"; -import ResetStatusWidget from "@/components/ResetStatusWidget.astro"; import SignalCard from "@/components/SignalCard.astro"; import ThemeToggle from "@/components/ThemeToggle.astro"; import BaseLayout from "@/layouts/BaseLayout.astro"; @@ -38,12 +36,6 @@ const hasPublishedSignals = signals.length > 0; const groupedSignals = groupSignalsByMonth(signals); const showGroupLabels = groupedSignals.length > 1; const clientFilterIds = FILTERS.map((filter) => filter.id); -const tryPathCount = signals.filter((signal) => Boolean(signal.how_to_try)).length; -const archivedSignalCount = Math.max(0, allSignals.length - signals.length); -const sourceLinkedCount = signals.filter((signal) => { - const refs = signal.source_refs; - return Boolean(refs.pr_url || refs.items?.length || refs.commit_urls.length); -}).length; const previewSignal: SignalCardData = { id: "preview-shell", @@ -216,50 +208,24 @@ const filterRuntimeScript = `(function () {
- -
-
    -
  • - Try paths - {tryPathCount} -
    • -
  • - Source links - {sourceLinkedCount}/{signals.length} -
    • -
  • - Archive - {archivedSignalCount} -
    • -
-

- Signal layer for Codex. GitHub-first, release-aware, and optimized for what is worth trying next. + Signal layer for Codex changes that are worth trying, watching, or adapting.

-
- -
- - -
- -
-
@@ -271,8 +237,7 @@ const filterRuntimeScript = `(function () {

Latest signals

- {signals.length} community-ready signals from {allSignals.length} analyzed upstream changes. - {archivedSignalCount > 0 ? ` ${archivedSignalCount} low-level watch items stay out of the public feed.` : ""} + Source-backed Codex changes, filtered for user-visible behavior, concrete try paths, and migration watch notes.

diff --git a/site/src/styles/global.css b/site/src/styles/global.css index 172f7e0b..e3c77721 100644 --- a/site/src/styles/global.css +++ b/site/src/styles/global.css @@ -1021,6 +1021,33 @@ code { margin: 0; } +.release-delta__criteria-list { + display: grid; + gap: 0.55rem; + margin: 0; + padding: 0; + list-style: none; +} + +.release-delta__criteria-item { + position: relative; + padding-left: 0.85rem; + color: var(--ink-soft); + font-size: 0.82rem; + line-height: 1.5; +} + +.release-delta__criteria-item::before { + position: absolute; + top: 0.62em; + left: 0; + width: 0.26rem; + height: 0.26rem; + border-radius: 999px; + background: var(--muted-soft); + content: ""; +} + .release-delta__state-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; @@ -1621,8 +1648,8 @@ code { grid-template-columns: minmax(0, 1fr) minmax(18rem, 23rem); grid-template-areas: "logo utility" - "note status" - "social actions"; + "note utility" + "social utility"; align-items: start; column-gap: 2.25rem; row-gap: 0.65rem; @@ -1675,8 +1702,8 @@ code { } .site-head__utility { - min-height: 3.22rem; - align-content: space-between; + min-height: 0; + align-content: start; justify-items: end; } From a95c62ff915e604f5d9437165657a481f7db3892 Mon Sep 17 00:00:00 2001 From: Yvette Carlisle Date: Wed, 13 May 2026 20:12:25 +0800 Subject: [PATCH 07/12] {"schema":"decodex/commit/1","summary":"Restore practical site utilities","authority":"manual"} --- site/src/pages/index.astro | 10 ++++++++++ site/src/styles/global.css | 16 ++++++++++++---- 2 files changed, 22 insertions(+), 4 deletions(-) diff --git a/site/src/pages/index.astro b/site/src/pages/index.astro index 0f28d8c5..3b954f9c 100644 --- a/site/src/pages/index.astro +++ b/site/src/pages/index.astro @@ -1,8 +1,10 @@ --- import { getCollection } from "astro:content"; import EmptyFeedState from "@/components/EmptyFeedState.astro"; +import AppcastDownloadWidget from "@/components/AppcastDownloadWidget.astro"; import FilterBar from "@/components/FilterBar.astro"; import ReleaseDeltaPanel from "@/components/ReleaseDeltaPanel.astro"; +import ResetStatusWidget from "@/components/ResetStatusWidget.astro"; import SignalCard from "@/components/SignalCard.astro"; import ThemeToggle from "@/components/ThemeToggle.astro"; import BaseLayout from "@/layouts/BaseLayout.astro"; @@ -208,6 +210,14 @@ const filterRuntimeScript = `(function () {
+ +
+ +
+ +
+ +

diff --git a/site/src/styles/global.css b/site/src/styles/global.css index e3c77721..7b8a1e7b 100644 --- a/site/src/styles/global.css +++ b/site/src/styles/global.css @@ -165,8 +165,8 @@ code { .site-topbar { display: flex; flex-direction: column; - gap: 1rem; - padding-bottom: 1.05rem; + gap: 0.8rem; + padding-bottom: 0.95rem; border-bottom: 1px solid var(--border); } @@ -192,9 +192,10 @@ code { .site-head__utility { display: grid; + grid-template-columns: minmax(0, 1fr); justify-items: end; align-content: start; - gap: 0.45rem; + gap: 0.58rem; } .site-head__theme { @@ -213,7 +214,7 @@ code { display: flex; justify-content: flex-end; align-items: center; - align-self: stretch; + align-self: start; } .site-head__status { @@ -1679,6 +1680,12 @@ code { grid-area: actions; } + .site-head__utility > .site-head__theme, + .site-head__utility > .site-head__status, + .site-head__utility > .site-head__actions { + grid-area: auto; + } + .site-brand__wordmark-image { height: 2.72rem; } @@ -1705,6 +1712,7 @@ code { min-height: 0; align-content: start; justify-items: end; + padding-top: 0; } .site-head__actions { From 332cbdbfee00e88121e5fbd78b6aa2d94f6ae325 Mon Sep 17 00:00:00 2001 From: Yvette Carlisle Date: Wed, 13 May 2026 20:18:20 +0800 Subject: [PATCH 08/12] {"schema":"decodex/commit/1","summary":"Redesign site layout from scratch","authority":"manual"} --- site/src/components/ReleaseDeltaPanel.astro | 6 +- site/src/pages/index.astro | 59 ++-- site/src/styles/global.css | 302 ++++++++++++++++++++ 3 files changed, 338 insertions(+), 29 deletions(-) diff --git a/site/src/components/ReleaseDeltaPanel.astro b/site/src/components/ReleaseDeltaPanel.astro index 25780053..78023f6d 100644 --- a/site/src/components/ReleaseDeltaPanel.astro +++ b/site/src/components/ReleaseDeltaPanel.astro @@ -68,12 +68,12 @@ const tryPathCount = trackedSignals.filter(hasConcreteTryPath).length;

-

Continuous radar

+

Upstream watch

- Codex changes worth trying + Latest window, already filtered.

- We read the upstream commit and PR trail, then publish only the changes that affect real Codex workflows: new capabilities, behavior shifts, migration risks, and concrete try paths. + This page does not mirror every commit. It surfaces the changes that can alter how people use Codex today.

diff --git a/site/src/pages/index.astro b/site/src/pages/index.astro index 3b954f9c..83e9a033 100644 --- a/site/src/pages/index.astro +++ b/site/src/pages/index.astro @@ -194,15 +194,39 @@ const filterRuntimeScript = `(function () {
-
- -

- Signal layer for Codex changes that are worth trying, watching, or adapting. -

- -
diff --git a/site/src/styles/global.css b/site/src/styles/global.css index 7b8a1e7b..b0eaa800 100644 --- a/site/src/styles/global.css +++ b/site/src/styles/global.css @@ -1858,3 +1858,305 @@ code { grid-template-columns: minmax(0, 1fr); } } + +/* Homepage redesign: compact reader-first dashboard layout. */ +.site-frame { + max-width: 74rem; + padding-top: 1.2rem; +} + +.site-topbar { + padding-bottom: 1rem; +} + +.site-topbar__head { + display: grid; + grid-template-columns: minmax(0, 1fr); + grid-template-areas: none; + gap: 1rem; +} + +.site-brand__main { + display: grid; + grid-area: auto; + gap: 0.5rem; + max-width: 43rem; + min-width: 0; +} + +.site-brand__main > .site-head__logo, +.site-brand__main > .site-brand__note, +.site-brand__main > .site-brand__social { + grid-area: auto; +} + +.site-brand__wordmark-image { + height: 2.55rem; +} + +.site-brand__eyebrow { + color: var(--muted-soft); + font-size: var(--label-size); + font-weight: 720; + letter-spacing: 0.1em; + line-height: 1.2; + text-transform: uppercase; +} + +.site-brand__title { + max-width: 40rem; + color: var(--ink); + font-size: 1.72rem; + font-weight: 720; + line-height: 1.08; +} + +.site-brand__note { + max-width: 40rem; + font-size: 0.94rem; + line-height: 1.55; +} + +.site-brand__social { + display: flex; + flex-wrap: wrap; + align-items: baseline; + gap: 0.35rem 0.55rem; + width: fit-content; +} + +.site-brand__social-copy { + max-width: none; + font-size: 0.78rem; +} + +.site-head__utility { + display: grid; + grid-area: auto; + grid-template-columns: minmax(0, 1fr); + gap: 0.55rem; + align-content: start; + justify-items: start; + min-width: 0; + padding: 0.8rem 0 0; + border-top: 1px solid var(--border); +} + +.site-head__theme, +.site-head__status, +.site-head__actions { + justify-content: flex-start; +} + +.reset-inline { + gap: 0.48rem; + font-size: 0.82rem; + line-height: 1.3; +} + +.appcast-download__body { + align-items: flex-start; +} + +.appcast-download__kicker, +.appcast-download__title-row { + justify-content: flex-start; +} + +.appcast-download__meta { + text-align: left; +} + +.release-delta { + margin-top: 1.05rem; + padding: 1rem 0 0.95rem; +} + +.release-delta__control-row { + gap: 0.35rem 0.85rem; +} + +.release-delta__hero { + gap: 0.68rem; +} + +.release-delta__hero-head { + grid-template-columns: minmax(0, 42rem); +} + +.release-delta__title { + font-size: 1.05rem; +} + +.release-delta__hero-subcopy { + max-width: 39rem; + font-size: 0.9rem; +} + +.release-delta__summary-rail { + gap: 0.45rem 1.1rem; +} + +.release-delta__content-grid { + grid-template-columns: minmax(0, 1fr); + gap: 1.15rem; +} + +.release-delta__overview-head > div, +.release-overview-card__body { + grid-template-columns: minmax(0, 1fr); + grid-template-areas: + "meta" + "title" + "why" + "details" + "action"; + row-gap: 0.36rem; +} + +.release-delta__overview-head > div { + grid-template-areas: + "meta" + "title"; +} + +.release-overview-card { + padding-top: 0.95rem; +} + +.release-overview-card__meta { + padding-top: 0; +} + +.release-overview-card__details { + grid-template-columns: minmax(0, 1fr); + gap: 0.75rem; +} + +.release-delta__state { + padding: 0.95rem 0 0; + border-top: 1px solid var(--border); + border-left: 0; +} + +.release-delta__criteria-list { + grid-template-columns: minmax(0, 1fr); +} + +.feed-toolbar { + grid-template-columns: minmax(0, 1fr); + gap: 0.9rem; + margin-top: 0.7rem; + padding-top: 0.95rem; +} + +.feed-toolbar__intro { + grid-template-columns: minmax(0, 1fr); + gap: 0.3rem; +} + +.feed-toolbar__summary { + max-width: 42rem; +} + +.filter-bar { + gap: 0.4rem 0.9rem; +} + +.signal-card { + grid-template-columns: minmax(0, 1fr); + gap: 0.65rem; + padding: 1.05rem 0; +} + +.signal-entry__rail { + flex-direction: row; + flex-wrap: wrap; + align-items: center; + gap: 0.45rem 0.75rem; +} + +.signal-entry__taxonomy { + flex-direction: row; + align-items: center; +} + +.signal-entry__title { + max-width: 48rem; + font-size: 1.04rem; +} + +.signal-entry__summary, +.signal-entry__why { + max-width: 48rem; +} + +.signal-entry-action__row, +.signal-entry-action__effect { + grid-template-columns: minmax(0, 1fr); + gap: 0.26rem; +} + +@media (min-width: 768px) { + .site-topbar__head { + grid-template-columns: minmax(0, 1fr) minmax(15.5rem, 18rem); + grid-template-areas: none; + align-items: start; + gap: 1.5rem 2.4rem; + } + + .site-head__utility { + justify-items: end; + padding: 0 0 0 1.2rem; + border-top: 0; + border-left: 1px solid var(--border); + } + + .site-head__theme, + .site-head__status, + .site-head__actions { + justify-content: flex-end; + } + + .appcast-download__body { + align-items: flex-end; + } + + .appcast-download__kicker, + .appcast-download__title-row { + justify-content: flex-end; + } + + .appcast-download__meta { + text-align: right; + } + + .release-delta__content-grid { + grid-template-columns: minmax(0, 1fr) minmax(14rem, 16rem); + gap: 2rem; + } + + .release-overview-card__details { + grid-template-columns: repeat(2, minmax(0, 1fr)); + } + + .release-delta__state { + padding: 0 0 0 1.1rem; + border-top: 0; + border-left: 1px solid var(--border); + } + + .release-delta__criteria-list { + grid-template-columns: minmax(0, 1fr); + } + + .feed-toolbar { + grid-template-columns: minmax(0, 1fr) auto; + align-items: start; + } + + .signal-entry-action__row, + .signal-entry-action__effect { + grid-template-columns: minmax(8rem, 9rem) minmax(0, 1fr); + } +} From c881311de88c02f5502f0672099616761e1af480 Mon Sep 17 00:00:00 2001 From: Yvette Carlisle Date: Wed, 13 May 2026 21:16:18 +0800 Subject: [PATCH 09/12] {"schema":"decodex/commit/1","summary":"Refactor Decodex official site","authority":"manual"} --- site/package-lock.json | 67 + site/package.json | 4 + site/src/components/EmptyFeedState.astro | 14 +- site/src/components/SignalCard.astro | 175 +- site/src/components/SignalSymphony.astro | 242 +++ site/src/pages/index.astro | 367 +++- site/src/styles/global.css | 2511 ++++++++-------------- 7 files changed, 1558 insertions(+), 1822 deletions(-) create mode 100644 site/src/components/SignalSymphony.astro diff --git a/site/package-lock.json b/site/package-lock.json index b5dd5d43..ea7262ae 100644 --- a/site/package-lock.json +++ b/site/package-lock.json @@ -13,7 +13,11 @@ "astro": "^6.3.1", "marked": "^18.0.3", "tailwindcss": "4.2.2", + "three": "^0.184.0", "typescript": "^5.9.3" + }, + "devDependencies": { + "@types/three": "^0.184.1" } }, "node_modules/@astrojs/check": { @@ -261,6 +265,13 @@ "sisteransi": "^1.0.5" } }, + "node_modules/@dimforge/rapier3d-compat": { + "version": "0.12.0", + "resolved": "https://registry.npmjs.org/@dimforge/rapier3d-compat/-/rapier3d-compat-0.12.0.tgz", + "integrity": "sha512-uekIGetywIgopfD97oDL5PfeezkFpNhwlzlaEYNOA0N6ghdsOvh/HYjSMek5Q2O1PYvRSDFcqFVJl4r4ZBwOow==", + "dev": true, + "license": "Apache-2.0" + }, "node_modules/@emmetio/abbreviation": { "version": "2.3.3", "resolved": "https://registry.npmjs.org/@emmetio/abbreviation/-/abbreviation-2.3.3.tgz", @@ -2306,6 +2317,13 @@ "vite": "^5.2.0 || ^6 || ^7 || ^8" } }, + "node_modules/@tweenjs/tween.js": { + "version": "23.1.3", + "resolved": "https://registry.npmjs.org/@tweenjs/tween.js/-/tween.js-23.1.3.tgz", + "integrity": "sha512-vJmvvwFxYuGnF2axRtPYocag6Clbb5YS7kLL+SO/TeVFzHqDIWrNKYtcsPMibjDx9O+bu+psAy9NKfWklassUA==", + "dev": true, + "license": "MIT" + }, "node_modules/@tybys/wasm-util": { "version": "0.10.1", "resolved": "https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.10.1.tgz", @@ -2364,12 +2382,41 @@ "@types/unist": "*" } }, + "node_modules/@types/stats.js": { + "version": "0.17.4", + "resolved": "https://registry.npmjs.org/@types/stats.js/-/stats.js-0.17.4.tgz", + "integrity": "sha512-jIBvWWShCvlBqBNIZt0KAshWpvSjhkwkEu4ZUcASoAvhmrgAUI2t1dXrjSL4xXVLB4FznPrIsX3nKXFl/Dt4vA==", + "dev": true, + "license": "MIT" + }, + "node_modules/@types/three": { + "version": "0.184.1", + "resolved": "https://registry.npmjs.org/@types/three/-/three-0.184.1.tgz", + "integrity": "sha512-6q4VdiqVsrTRqmk62/BnlcAvIrnDM0zf2ZDVKI5kZiniWrSaOHaQzmbp+BNzoggc/8tgW412pL//wZIxu2PPTA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@dimforge/rapier3d-compat": "~0.12.0", + "@tweenjs/tween.js": "~23.1.3", + "@types/stats.js": "*", + "@types/webxr": ">=0.5.17", + "fflate": "~0.8.2", + "meshoptimizer": "~1.1.1" + } + }, "node_modules/@types/unist": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/@types/unist/-/unist-3.0.3.tgz", "integrity": "sha512-ko/gIFJRv177XgZsZcBwnqJN5x/Gien8qNOn0D5bQU/zAzVf9Zt3BlcUiLqhV9y4ARk0GbT3tnUiPNgnTXzc/Q==", "license": "MIT" }, + "node_modules/@types/webxr": { + "version": "0.5.24", + "resolved": "https://registry.npmjs.org/@types/webxr/-/webxr-0.5.24.tgz", + "integrity": "sha512-h8fgEd/DpoS9CBrjEQXR+dIDraopAEfu4wYVNY2tEPwk60stPWhvZMf4Foo5FakuQ7HFZoa8WceaWFervK2Ovg==", + "dev": true, + "license": "MIT" + }, "node_modules/@ungap/structured-clone": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/@ungap/structured-clone/-/structured-clone-1.3.0.tgz", @@ -3336,6 +3383,13 @@ } } }, + "node_modules/fflate": { + "version": "0.8.2", + "resolved": "https://registry.npmjs.org/fflate/-/fflate-0.8.2.tgz", + "integrity": "sha512-cPJU47OaAoCbg0pBvzsgpTPhmhqI5eJjh/JIu8tPj5q+T7iLvW/JAYUqmE7KOB4R1ZyEhzBaIQpQpardBF5z8A==", + "dev": true, + "license": "MIT" + }, "node_modules/flattie": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/flattie/-/flattie-1.1.1.tgz", @@ -4308,6 +4362,13 @@ "integrity": "sha512-9Yubnt3e8A0OKwxYSXyhLymGW4sCufcLG6VdiDdUGVkPhpqLxlvP5vl1983gQjJl3tqbrM731mjaZaP68AgosQ==", "license": "CC0-1.0" }, + "node_modules/meshoptimizer": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/meshoptimizer/-/meshoptimizer-1.1.1.tgz", + "integrity": "sha512-oRFNWJRDA/WTrVj7NWvqa5HqE1t9MYDj2VaWirQCzCCrAd2GHrqR/sQezCxiWATPNlKTcRaPRHPJwIRoPBAp5g==", + "dev": true, + "license": "MIT" + }, "node_modules/micromark": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/micromark/-/micromark-4.0.2.tgz", @@ -5743,6 +5804,12 @@ "url": "https://opencollective.com/webpack" } }, + "node_modules/three": { + "version": "0.184.0", + "resolved": "https://registry.npmjs.org/three/-/three-0.184.0.tgz", + "integrity": "sha512-wtTRjG92pM5eUg/KuUnHsqSAlPM296brTOcLgMRqEeylYTh/CdtvKUvCyyCQTzFuStieWxvZb8mVTMvdPyUpxg==", + "license": "MIT" + }, "node_modules/tiny-inflate": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/tiny-inflate/-/tiny-inflate-1.0.3.tgz", diff --git a/site/package.json b/site/package.json index 5a1d3b13..fdf2a2d0 100644 --- a/site/package.json +++ b/site/package.json @@ -16,9 +16,13 @@ "astro": "^6.3.1", "marked": "^18.0.3", "tailwindcss": "4.2.2", + "three": "^0.184.0", "typescript": "^5.9.3" }, "overrides": { "yaml": "2.8.4" + }, + "devDependencies": { + "@types/three": "^0.184.1" } } diff --git a/site/src/components/EmptyFeedState.astro b/site/src/components/EmptyFeedState.astro index 52d3414a..69498196 100644 --- a/site/src/components/EmptyFeedState.astro +++ b/site/src/components/EmptyFeedState.astro @@ -31,18 +31,12 @@ const messagesJson = JSON.stringify(messages); --- diff --git a/site/src/components/SignalCard.astro b/site/src/components/SignalCard.astro index 19083991..b6fc53d0 100644 --- a/site/src/components/SignalCard.astro +++ b/site/src/components/SignalCard.astro @@ -43,6 +43,7 @@ const sourceItems: SourceRefItem[] = url, })), ]; +const primarySource = sourceItems.find((source) => source.kind === "pull_request") ?? sourceItems[0]; ---
- - -
-
- {signal.previewLabel ? ( -

- {signal.previewLabel} -

- ) : null} - -

-

- -

- Why it matters - + {signal.expected_effect ? ( +

+ Expected effect +

-

- -
-

- Action - - {renderedHowToTry ? ( - <> - Try now{" "} - - - ) : ( - "Watch only. No safe try path is published for this signal yet." - )} - -

- - {signal.expected_effect ? ( -

- Expected effect - -

- ) : null} - - {configToggleFlags.length > 0 ? ( -
-

Config

-

- Add to $CODEX_HOME/config.toml. -

-
- {configToggleFlags.map((flag) => ( - - {flag.display} - - ))} -
-
- ) : null} - - {visibleFlags.length > 0 ? ( -
- {visibleFlags.map((flag) => ( - - {flag.display} - - ))} -
- ) : null} -
+ ) : null} + + {configToggleFlags.length > 0 || visibleFlags.length > 0 ? ( +
+ {configToggleFlags.length > 0 ? Add to $CODEX_HOME/config.toml : null} + {configToggleFlags.map((flag) => ( + + {flag.display} + + ))} + {visibleFlags.map((flag) => ( + + {flag.display} + + ))} +
+ ) : null} -
- - Sources and evidence +
+ + Evidence {signal.proof_points.length} proof point{signal.proof_points.length === 1 ? "" : "s"} -
-
    +
    +
      {signal.proof_points.map((point) => (
    • @@ -156,9 +133,9 @@ const sourceItems: SourceRefItem[] =
    {signal.caveats.length > 0 ? ( -
    -

    Caveats

    -
      +
      +

      Caveats

      +
        {signal.caveats.map((caveat) => (
      • @@ -168,23 +145,21 @@ const sourceItems: SourceRefItem[] =
      ) : null} - {renderedWatchState ? ( -

      - Watch state{" "} + {renderedWatchState && renderedHowToTry ? ( +

      + Watch state

      ) : null} -
        +
          {sourceItems.map((source) => ( -
        1. - - {source.kind === "pull_request" ? "PR" : "Commit"} - - +
        2. + {source.kind === "pull_request" ? "PR" : "Commit"} + {source.title} - {source.meta ? {source.meta} : null} + {source.meta ? {source.meta} : null}
          3. ))}
        diff --git a/site/src/components/SignalSymphony.astro b/site/src/components/SignalSymphony.astro new file mode 100644 index 00000000..26b336a3 --- /dev/null +++ b/site/src/components/SignalSymphony.astro @@ -0,0 +1,242 @@ +--- +type Props = { + totalSignals: number; + tryPathCount: number; + highImpactCount: number; +}; + +const { totalSignals, tryPathCount, highImpactCount } = Astro.props; +--- + + + + diff --git a/site/src/pages/index.astro b/site/src/pages/index.astro index 83e9a033..40a0f1b6 100644 --- a/site/src/pages/index.astro +++ b/site/src/pages/index.astro @@ -1,19 +1,27 @@ --- import { getCollection } from "astro:content"; -import EmptyFeedState from "@/components/EmptyFeedState.astro"; import AppcastDownloadWidget from "@/components/AppcastDownloadWidget.astro"; +import EmptyFeedState from "@/components/EmptyFeedState.astro"; import FilterBar from "@/components/FilterBar.astro"; -import ReleaseDeltaPanel from "@/components/ReleaseDeltaPanel.astro"; import ResetStatusWidget from "@/components/ResetStatusWidget.astro"; import SignalCard from "@/components/SignalCard.astro"; +import SignalSymphony from "@/components/SignalSymphony.astro"; import ThemeToggle from "@/components/ThemeToggle.astro"; import BaseLayout from "@/layouts/BaseLayout.astro"; -import { type ReleaseDeltaData } from "@/lib/release-delta"; +import { + defaultComparison, + releaseLabel, + type ReleaseDeltaData, +} from "@/lib/release-delta"; +import { renderMarkdownInline } from "@/lib/render-markdown"; import { FILTERS, + formatPublishedAt, groupSignalsByMonth, homepageSignals, + impactLabel, isFilterId, + kindLabel, sortSignals, type FilterId, type SignalCardData, @@ -34,10 +42,6 @@ const releaseDelta: ReleaseDeltaData | null = releaseDeltaEntries .map((entry) => entry.data as ReleaseDeltaData) .find((entry) => entry.repo === "openai/codex") ?? null; -const hasPublishedSignals = signals.length > 0; -const groupedSignals = groupSignalsByMonth(signals); -const showGroupLabels = groupedSignals.length > 1; -const clientFilterIds = FILTERS.map((filter) => filter.id); const previewSignal: SignalCardData = { id: "preview-shell", @@ -72,6 +76,91 @@ const previewSignal: SignalCardData = { previewLabel: "Scaffold Preview", }; +const visibleSignals = signals.length > 0 ? signals : [previewSignal]; +const hasPublishedSignals = signals.length > 0; +const groupedSignals = groupSignalsByMonth(signals); +const showGroupLabels = groupedSignals.length > 1; +const clientFilterIds = FILTERS.map((filter) => filter.id); + +function hasConcreteTryPath(signal: SignalCardData): boolean { + return Boolean(signal.how_to_try && signal.expected_effect); +} + +function primarySourceLabel(signal: SignalCardData): string { + const pullRequest = signal.source_refs.items?.find((item) => item.kind === "pull_request"); + if (pullRequest?.meta) return pullRequest.meta; + if (signal.source_refs.pr_url) { + const match = signal.source_refs.pr_url.match(/\/pull\/(\d+)$/); + if (match) return `#${match[1]}`; + } + return signal.source_refs.repo; +} + +const tryPathSignals = visibleSignals.filter(hasConcreteTryPath); +const prioritySignals = [ + ...tryPathSignals, + ...visibleSignals.filter((signal) => !hasConcreteTryPath(signal)), +].slice(0, 3); +const leadSignal = + visibleSignals.find((signal) => signal.impact === "high") ?? + tryPathSignals[0] ?? + visibleSignals[0]; +const watchSignals = visibleSignals + .filter((signal) => signal.watch_state || signal.caveats.length > 0) + .slice(0, 3); +const highImpactCount = visibleSignals.filter((signal) => signal.impact === "high").length; +const tryPathCount = visibleSignals.filter(hasConcreteTryPath).length; +const latestSignalAt = visibleSignals.reduce((latest, signal) => { + if (!latest || signal.published_at > latest) return signal.published_at; + return latest; +}, null); + +const activeComparison = releaseDelta ? defaultComparison(releaseDelta) : null; +const stableByTag = releaseDelta + ? new Map(releaseDelta.release_options.stable.map((release) => [release.tag_name, release])) + : new Map(); +const previewByTag = releaseDelta + ? new Map(releaseDelta.release_options.preview.map((release) => [release.tag_name, release])) + : new Map(); +const activeStable = + releaseDelta && activeComparison + ? stableByTag.get(activeComparison.stable_tag_name) ?? releaseDelta.stable_release + : null; +const activePreview = + releaseDelta && activeComparison + ? previewByTag.get(activeComparison.prerelease_tag_name) ?? releaseDelta.prerelease + : null; +const releaseWindow = + releaseDelta && activeComparison && activeStable && activePreview + ? { + stable: releaseLabel(activeStable, releaseDelta.tag_prefix), + preview: releaseLabel(activePreview, releaseDelta.tag_prefix), + compareUrl: activeComparison.compare.url, + commits: activeComparison.compare.total_commits, + status: activeComparison.compare.status, + updatedAt: formatPublishedAt(releaseDelta.generated_at), + } + : null; + +const productLoops = [ + { + title: "Watch every upstream move", + body: "Track Codex commits, PRs, prereleases, and release checkpoints without waiting for official notes.", + }, + { + title: "Read code as evidence", + body: "Bundle PR bodies, touched files, tests, caveats, and migration signals into source-backed entries.", + }, + { + title: "Route impact into Decodex", + body: "Mark what affects Control Plane, app-server integration, plugins, automation, and operator workflows.", + }, + { + title: "Publish useful community output", + body: "Turn confirmed changes into X posts, release rollups, and practical try paths for Codex users.", + }, +]; + const filterRuntimeScript = `(function () { var validFilters = ${JSON.stringify(clientFilterIds)}; var defaultFilter = "all"; @@ -184,102 +273,226 @@ const filterRuntimeScript = `(function () { applyFilter(readFilter(), { updateHistory: false, animate: false }); }); })();`; - --- -
        -
        -
        -
        - +
        +
        + -

        Codex signal feed

        -

        - Changes worth trying before they become release notes. -

        +
        + + + +
        -

        - We track Codex upstream commits, extract user-visible behavior, and turn the useful parts into try paths, watch notes, and release rollups. +

        +
        +

        Decodex

        +

        + A Symphony-style automation layer for Codex: it watches upstream, reads the code, extracts practical impact, updates Decodex Control Plane priorities, and publishes useful community signal.

        - - +
        + Open live radar + See the system + + Follow @decodexspace + +
        -
        -
        - + +
        -
        - -
        +
        +
        + {visibleSignals.length} + curated signals +
        +
        + {tryPathCount} + try paths +
        +
        + {highImpactCount} + high impact +
        +
        + {formatPublishedAt(latestSignalAt ?? leadSignal.published_at)} + latest analysis
        -
        +
- {releaseDelta ? ( - - ) : null} +
+
+

What Decodex automates

+

+ The website is the public readout of a continuous Decodex loop, not a static changelog. +

+
+
+ {productLoops.map((item, index) => ( +
+ {String(index + 1).padStart(2, "0")} +

{item.title}

+

{item.body}

+
+ ))} +
+
-
-
-

Latest signals

-

- Source-backed Codex changes, filtered for user-visible behavior, concrete try paths, and migration watch notes. +

+
+

Live Codex radar

+

+ High-signal upstream changes become reader-facing action, watch state, and Control Plane context.

-
- +
+
+
+ {primarySourceLabel(leadSignal)} + {kindLabel(leadSignal.kind)} + {impactLabel(leadSignal.impact)} +
+

+

+

+ {leadSignal.how_to_try ? "Try path" : "Watch note"} +

+

+ Open the evidence +

+ +
+
+

Next useful reads

+
    + {prioritySignals.map((signal) => ( +
  1. + + {primarySourceLabel(signal)} + + +
    2. + ))} +
+
+ +
+

Watch notes

+
    + {(watchSignals.length > 0 ? watchSignals : prioritySignals).map((signal) => ( +
  • + {primarySourceLabel(signal)} +

    +

    • + ))} +
+
+
-
- {!hasPublishedSignals ? : null} - {hasPublishedSignals ? : null} +
+
+

Publisher output

+

+ Decodex turns the same evidence base into public posts, prerelease briefs, and release rollups. +

+
+
+
+ Draft logic +

+ Every post starts from commit and PR evidence, then separates what changed, who should try it, and what Decodex should absorb into B-side workflows. +

+
+
+ Commit evidence + Human-grade analysis + X post + Release rollup +
+
+
- {groupedSignals.map((group) => ( -
- {showGroupLabels ? ( -
- {group.label} -
- ) : null} +
+
+
+

Evidence feed

+

+ Every entry stays source-backed. Use filters when you only need runnable changes or high-impact shifts. +

+
+ +
-
- {group.items.map((signal) => )} -
-
- ))} +
+ {!hasPublishedSignals ? : null} + {hasPublishedSignals ? : null} + + {groupedSignals.map((group) => ( +
+ {showGroupLabels ?

{group.label}

: null} +
+ {group.items.map((signal) => )} +
+
+ ))} +
{hasPublishedSignals ? : null} diff --git a/site/src/styles/global.css b/site/src/styles/global.css index b0eaa800..79b34eaf 100644 --- a/site/src/styles/global.css +++ b/site/src/styles/global.css @@ -2,98 +2,93 @@ :root, :root[data-theme="light"] { + color-scheme: light; --font-sans: "Inter", "SF Pro Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; --font-display: "Inter", "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; - --font-mono: "SFMono-Regular", "SF Mono", ui-monospace, Menlo, Monaco, monospace; - --rail-width: 9.5rem; - --content-gap: 1.85rem; - --measure: 45rem; - --label-size: 0.68rem; - --bg: #f7f8fc; - --bg-soft: #eef1f7; - --bg-subtle: #e6e9f2; + --font-mono: "SFMono-Regular", "SF Mono", ui-monospace, Menlo, Monaco, Consolas, monospace; + --bg: #f3f5f7; --panel: #ffffff; - --ink: #1f2335; - --ink-soft: #3b4261; - --muted: #6b7394; - --muted-soft: #8c93b8; - --border: #d5d6db; - --border-strong: #c4c8da; - --accent: #2959aa; - --accent-soft: #e9eefb; - --link: #2e7de9; - --success: #587539; - --success-soft: #eff7e8; - --success-border: #c8dcb1; - --code-bg: #edf2fa; - --code-border: #c8d4f0; - --link-underline: #c4c8da; -} - -@media (prefers-color-scheme: dark) { - :root:not([data-theme]), - :root[data-theme="system"] { - --bg: #181a21; - --bg-soft: #20232d; - --bg-subtle: #262a36; - --panel: #20232d; - --ink: #d9def0; - --ink-soft: #b4bdd3; - --muted: #7e879d; - --muted-soft: #636c83; - --border: #303545; - --border-strong: #434a60; - --accent: #82aaff; - --accent-soft: #202b43; - --link: #90b4ff; - --success: #9ece6a; - --success-soft: #223128; - --success-border: #364a30; - --code-bg: #252c3d; - --code-border: #3d4964; - --link-underline: #46516a; - } -} - -:root[data-theme="dark"] { - color-scheme: dark; - --bg: #181a21; - --bg-soft: #20232d; - --bg-subtle: #262a36; - --panel: #20232d; - --ink: #d9def0; - --ink-soft: #b4bdd3; - --muted: #7e879d; - --muted-soft: #636c83; - --border: #303545; - --border-strong: #434a60; - --accent: #82aaff; - --accent-soft: #202b43; - --link: #90b4ff; - --success: #9ece6a; - --success-soft: #223128; - --success-border: #364a30; - --code-bg: #252c3d; - --code-border: #3d4964; - --link-underline: #46516a; -} - -:root[data-theme="light"] { - color-scheme: light; + --panel-soft: #edf1f6; + --ink: #111720; + --ink-soft: #3c4656; + --muted: #697486; + --muted-soft: #8b95a6; + --border: #d4dae3; + --border-strong: #b7c0cc; + --accent: #2563eb; + --accent-strong: #1748b5; + --accent-soft: #e7efff; + --signal: #b6f13a; + --signal-ink: #203300; + --success: #4f7b35; + --success-soft: #ecf6e7; + --success-border: #c8dfbc; + --code-bg: #e8edf4; + --code-border: #c9d2df; + --stage-bg: #0c1118; + --stage-ink: #f5f7ff; + --stage-soft: #b9c2d4; + --stage-muted: #778397; + --stage-border: rgba(255, 255, 255, 0.14); } @media (prefers-color-scheme: dark) { :root:not([data-theme]), :root[data-theme="system"] { color-scheme: dark; + --bg: #0d1117; + --panel: #141a22; + --panel-soft: #10161f; + --ink: #edf2ff; + --ink-soft: #bac4d5; + --muted: #8792a4; + --muted-soft: #687489; + --border: #27303d; + --border-strong: #394556; + --accent: #8ab4ff; + --accent-strong: #aecbff; + --accent-soft: #16243b; + --signal: #b6f13a; + --signal-ink: #162300; + --success: #a7d46f; + --success-soft: #1e2d20; + --success-border: #344c31; + --code-bg: #1e2632; + --code-border: #344154; + --stage-bg: #0c1118; + --stage-ink: #f5f7ff; + --stage-soft: #b9c2d4; + --stage-muted: #778397; + --stage-border: rgba(255, 255, 255, 0.14); } } -@media (prefers-color-scheme: light) { - :root:not([data-theme]), - :root[data-theme="system"] { - color-scheme: light; - } +:root[data-theme="dark"] { + color-scheme: dark; + --bg: #0d1117; + --panel: #141a22; + --panel-soft: #10161f; + --ink: #edf2ff; + --ink-soft: #bac4d5; + --muted: #8792a4; + --muted-soft: #687489; + --border: #27303d; + --border-strong: #394556; + --accent: #8ab4ff; + --accent-strong: #aecbff; + --accent-soft: #16243b; + --signal: #b6f13a; + --signal-ink: #162300; + --success: #a7d46f; + --success-soft: #1e2d20; + --success-border: #344c31; + --code-bg: #1e2632; + --code-border: #344154; + --stage-bg: #0c1118; + --stage-ink: #f5f7ff; + --stage-soft: #b9c2d4; + --stage-muted: #778397; + --stage-border: rgba(255, 255, 255, 0.14); } * { @@ -113,435 +108,432 @@ body { color: var(--ink); font-family: var(--font-sans); font-size: 16px; - line-height: 1.55; + line-height: 1.5; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; - transition: - background-color 180ms ease, - color 180ms ease, - border-color 180ms ease; } h1, h2, h3, -h4, -h5, -h6 { - margin: 0; - font-family: var(--font-display); - font-weight: 750; - letter-spacing: 0; -} - p, ul, -ol, -dl { +ol { margin: 0; } +h1, +h2, +h3 { + font-family: var(--font-display); + letter-spacing: 0; +} + a { color: inherit; text-decoration: none; } -code { - font-family: var(--font-mono); +button, +input, +select, +textarea { + font: inherit; } -.site-shell { - background: var(--bg); +code { + padding: 0.08rem 0.28rem; + border: 1px solid var(--code-border); + border-radius: 0.28rem; + background: var(--code-bg); + color: var(--ink); + font-family: var(--font-mono); + font-size: 0.88em; } -.site-frame { - width: 100%; - max-width: 71.5rem; +.official-site { min-height: 100vh; - margin: 0 auto; - padding: 1.35rem 1.15rem 5rem; -} - -.site-topbar { - display: flex; - flex-direction: column; - gap: 0.8rem; - padding-bottom: 0.95rem; - border-bottom: 1px solid var(--border); + background: + linear-gradient(180deg, transparent 0, transparent 46rem, var(--bg) 46rem), + radial-gradient(circle at 85% 2%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 28rem), + var(--bg); } -.site-topbar__head { +.official-hero { + position: relative; display: grid; - gap: 0.72rem 1.75rem; + grid-template-rows: auto minmax(0, 1fr) auto; + min-height: min(45rem, 100vh); + overflow: hidden; + background: + radial-gradient(circle at 68% 38%, rgba(138, 180, 255, 0.18), transparent 24rem), + linear-gradient(135deg, #0a0f16, #111923 58%, #071018); + color: var(--stage-ink); } -.site-head__logo, -.site-head__utility, -.site-head__theme, -.site-head__cues, -.site-head__actions, -.site-head__status { - min-width: 0; +.official-hero::before { + content: ""; + position: absolute; + inset: 0; + z-index: 1; + background: + linear-gradient(90deg, rgba(10, 15, 22, 0.92) 0%, rgba(10, 15, 22, 0.68) 44%, rgba(10, 15, 22, 0.18) 78%), + linear-gradient(180deg, rgba(10, 15, 22, 0.06), rgba(10, 15, 22, 0.64)); + pointer-events: none; } -.site-head__logo { - display: flex; - justify-content: flex-start; - align-items: flex-start; +.official-hero::after { + content: ""; + position: absolute; + inset: 0; + z-index: 1; + background: + linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px), + linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px); + background-size: 2.4rem 2.4rem; + mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.68), transparent 78%); + pointer-events: none; } -.site-head__utility { - display: grid; - grid-template-columns: minmax(0, 1fr); - justify-items: end; - align-content: start; - gap: 0.58rem; +.symphony-scene { + position: absolute; + inset: 0; + z-index: 0; } -.site-head__theme { - display: flex; - justify-content: flex-end; - align-items: flex-start; +.symphony-scene canvas { + display: block; + width: 100%; + height: 100%; } -.site-head__cues { - display: flex; - justify-content: flex-end; +.site-header { + position: relative; + z-index: 2; + display: grid; + grid-template-columns: auto minmax(0, 1fr) auto; + gap: 1rem; align-items: center; + width: min(100%, 82rem); + margin: 0 auto; + padding: 1.1rem 1.15rem; } -.site-head__actions { - display: flex; - justify-content: flex-end; +.site-logo { + display: inline-flex; + width: fit-content; align-items: center; - align-self: start; } -.site-head__status { - display: flex; - justify-content: flex-end; - align-items: center; +.site-logo__image { + display: block; + width: auto; + height: 2.35rem; } -.site-chrome { - display: flex; - justify-content: flex-start; - flex-shrink: 0; +.site-nav { + display: none; + align-items: center; + justify-content: center; + gap: 1rem; + min-width: 0; } -.site-brand { - display: grid; - align-content: start; - gap: 0.95rem; - min-width: 0; +.site-nav a { + color: var(--stage-soft); + font-size: 0.84rem; + font-weight: 740; + line-height: 1; } -.site-brand__bar { - display: flex; - align-items: flex-start; - justify-content: flex-start; +.site-nav a:hover { + color: var(--stage-ink); } -.site-brand__wordmark { +.theme-toggle { display: inline-flex; - width: fit-content; align-items: center; + gap: 0.18rem; + width: fit-content; + padding: 0.18rem; + border: 1px solid rgba(255, 255, 255, 0.14); + border-radius: 999px; + background: rgba(15, 22, 32, 0.72); + backdrop-filter: blur(16px); } -.site-brand__wordmark-image { - display: block; - width: auto; - height: 2.58rem; +.theme-toggle__button { + min-height: 1.8rem; + padding: 0.35rem 0.7rem; + border: 0; + border-radius: 999px; + background: transparent; + color: var(--stage-muted); + cursor: pointer; + font-size: 0.72rem; + font-weight: 760; + line-height: 1; } -.site-brand__note { - max-width: 35rem; - font-size: 0.95rem; - line-height: 1.48; - color: var(--ink-soft); +.theme-toggle__button:hover { + color: var(--stage-ink); } -.site-brand__meta { - display: grid; - gap: 0.58rem; +.theme-toggle__button[aria-pressed="true"] { + background: var(--stage-ink); + color: #111720; } -.site-brand__signals { - display: flex; - flex-wrap: wrap; +.hero-grid { + position: relative; + z-index: 2; + display: grid; + grid-template-columns: minmax(0, 1fr); + gap: 1.4rem; align-items: center; - gap: 0.7rem 1rem; + width: min(100%, 82rem); + margin: 0 auto; + padding: 2.2rem 1.15rem 1.8rem; } -.site-brand__cues { - display: flex; - flex-wrap: wrap; - gap: 0.42rem; - padding: 0; - margin: 0; - list-style: none; +.hero-copy { + display: grid; + gap: 1.05rem; + align-content: center; + min-width: 0; } -.site-brand__cue { - display: inline-flex; - align-items: center; - gap: 0.4rem; - padding: 0.32rem 0.62rem; - border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--border)); - border-radius: 999px; - background: color-mix(in srgb, var(--accent-soft) 78%, var(--panel)); - color: var(--muted); - font-family: var(--font-mono); - font-size: 0.64rem; - font-weight: 700; - letter-spacing: 0.05em; - line-height: 1.1; - min-height: 1.5rem; +.hero-copy h1 { + color: var(--stage-ink); + font-size: clamp(4.25rem, 13vw, 9.5rem); + font-weight: 850; + line-height: 0.82; } -.site-brand__cue-label { - color: var(--muted-soft); - text-transform: uppercase; +.hero-copy p { + max-width: 47rem; + color: var(--stage-soft); + font-size: clamp(1rem, 1.55vw, 1.24rem); + line-height: 1.62; } -.site-brand__cue-value { - color: var(--accent); - font-size: 0.68rem; - font-weight: 800; - letter-spacing: 0.02em; - text-transform: none; +.hero-actions { + display: flex; + flex-wrap: wrap; + gap: 0.55rem; } -.site-brand__status { - display: flex; +.hero-actions a, +.lead-brief__link { + display: inline-flex; align-items: center; - justify-content: flex-start; - min-width: 0; - padding: 0.1rem 0 0; + justify-content: center; + min-height: 2.28rem; + padding: 0.55rem 0.88rem; + border: 1px solid rgba(255, 255, 255, 0.22); + border-radius: 999px; + color: var(--stage-ink); + font-size: 0.84rem; + font-weight: 780; + line-height: 1; + backdrop-filter: blur(16px); } -.site-brand__social { - display: grid; - align-content: center; - align-self: start; - gap: 0.16rem; - width: fit-content; - height: auto; - color: var(--ink-soft); - transition: color 160ms ease; +.hero-actions a:first-child, +.lead-brief__link { + border-color: color-mix(in srgb, var(--signal) 84%, transparent); + background: var(--signal); + color: var(--signal-ink); } -.site-brand__social:hover { - color: var(--ink); +.hero-actions a:hover, +.lead-brief__link:hover { + border-color: var(--signal); + color: var(--signal); } -.site-brand__social-handle { - font-size: 0.9rem; - font-weight: 700; - letter-spacing: 0; - color: var(--accent); +.hero-actions a:first-child:hover, +.lead-brief__link:hover { + color: var(--signal-ink); } -.site-brand__social-copy { - max-width: 18rem; - font-size: 0.76rem; - line-height: 1.42; - color: var(--muted); +.hero-console { + display: grid; + gap: 0.65rem; + min-width: 0; + padding: 0.8rem; + border: 1px solid var(--stage-border); + border-radius: 1rem; + background: rgba(10, 15, 23, 0.58); + backdrop-filter: blur(20px); } -.site-sidecard { +.console-row, +.console-window { display: grid; - align-content: start; - justify-items: end; - gap: 0.95rem; + gap: 0.38rem; min-width: 0; - text-align: right; + padding: 0.7rem 0.72rem; + border: 1px solid var(--stage-border); + border-radius: 0.72rem; + background: rgba(255, 255, 255, 0.045); +} + +.console-row > span, +.console-window > span, +.hero-bottom span, +.system-loop span, +.publisher-note span, +.publisher-flow span, +.lead-brief__meta span, +.signal-card__taxonomy span, +.signal-card__readout h3, +.signal-card__effect > span:first-child, +.signal-card__flags > span, +.signal-card__caveats h3, +.signal-card__watch > span:first-child { + color: var(--muted); + font-size: 0.72rem; + font-weight: 780; + line-height: 1.2; + text-transform: uppercase; } -.site-sidecard__chrome { - display: flex; - justify-content: flex-end; - width: 100%; +.official-hero .console-row > span, +.official-hero .console-window > span, +.official-hero .hero-bottom span { + color: var(--stage-muted); } -.site-sidecard__status { - display: flex; - justify-content: flex-end; - align-items: center; - min-width: 0; - width: 100%; +.console-window strong { + color: var(--stage-ink); + font-size: 1rem; + font-weight: 800; + line-height: 1.1; } -.feed-toolbar__label, -.feed-group__label span, -.signal-entry-date, -.signal-entry__taxonomy-item, -.signal-entry-label, -.signal-entry-details__summary, -.release-delta__eyebrow, -.release-delta__panel-label, -.release-highlight__meta, -.release-highlight__try-label, -.signal-source-timeline__kind, -.signal-source-timeline__meta { - font-family: var(--font-sans); +.console-window a { + color: var(--stage-soft); + font-size: 0.82rem; + line-height: 1.28; } -.theme-toggle { - display: inline-flex; - align-items: center; - gap: 0.15rem; - width: fit-content; - padding: 0.08rem; - border: 1px solid color-mix(in srgb, var(--accent) 18%, var(--border)); - border-radius: 999px; - background: color-mix(in srgb, var(--accent-soft) 78%, var(--panel)); - min-height: 1.5rem; +.console-window a:hover { + color: var(--signal); } -.theme-toggle__button { - border: 0; - border-radius: 999px; - background: transparent; - color: var(--muted); - padding: 0.3rem 0.66rem; - font: inherit; - font-size: 0.64rem; - font-weight: 700; - letter-spacing: 0.05em; - line-height: 1.1; - font-family: var(--font-mono); - text-transform: uppercase; - cursor: pointer; - transition: - background-color 180ms ease, - color 180ms ease; +.hero-bottom { + position: relative; + z-index: 2; + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + width: min(100%, 82rem); + margin: 0 auto; + padding: 0 1.15rem 1.2rem; } -.theme-toggle__button:hover { - color: var(--ink); +.hero-bottom div { + display: grid; + gap: 0.25rem; + min-width: 0; + padding: 0.78rem 0.65rem; + border-top: 1px solid var(--stage-border); + border-right: 1px solid var(--stage-border); + background: rgba(10, 15, 23, 0.38); + backdrop-filter: blur(16px); } -.theme-toggle__button[aria-pressed="true"] { - background: var(--accent-soft); - color: var(--accent); +.hero-bottom div:nth-child(2n), +.hero-bottom div:last-child { + border-right: 0; +} + +.hero-bottom strong { + color: var(--stage-ink); + font-size: 1.08rem; + font-weight: 820; + line-height: 1; } .appcast-download { position: relative; display: flex; - align-items: center; - height: 100%; min-width: 0; } .appcast-download__surface { position: relative; display: flex; - align-items: center; - height: 100%; + min-width: 0; } .appcast-download__primary { display: inline-flex; - align-items: center; - justify-content: center; min-width: 0; padding: 0; border: 0; - border-radius: 0; - background: none; - color: var(--ink); - transition: - color 180ms ease, - opacity 180ms ease; + background: transparent; + color: inherit; } .appcast-download__body { - display: inline-flex; - flex-direction: column; - align-items: flex-end; - justify-content: center; - gap: 0.1rem; -} - -.appcast-download__eyebrow, -.appcast-download__version-meta { - font-family: var(--font-mono); + display: grid; + gap: 0.14rem; + min-width: 0; } -.appcast-download__kicker { - display: inline-flex; - align-items: baseline; - justify-content: flex-end; +.appcast-download__kicker, +.appcast-download__title-row { + display: flex; + min-width: 0; } .appcast-download__eyebrow { - font-size: 0.58rem; - font-weight: 700; - letter-spacing: 0.08em; + color: var(--signal); + font-size: 0.7rem; + font-weight: 780; line-height: 1; text-transform: uppercase; - color: var(--accent); } .appcast-download__title { - font-size: 0.8rem; - font-weight: 680; - letter-spacing: 0; - line-height: 1; - color: var(--ink); -} - -.appcast-download__title-row { - display: inline-flex; - align-items: center; - justify-content: flex-end; - gap: 0; + color: var(--stage-ink); + font-size: 0.96rem; + font-weight: 780; + line-height: 1.15; } .appcast-download__meta { - font-size: 0.62rem; - line-height: 1.05; - text-align: right; - color: var(--muted); -} - -.appcast-download__surface[data-appcast-disabled="true"] .appcast-download__primary { - opacity: 0.72; -} - -.appcast-download__primary:hover, -.appcast-download[data-appcast-open="true"] .appcast-download__primary, -.appcast-download__primary:focus-visible { - color: var(--accent); - opacity: 1; + color: var(--stage-soft); + font-size: 0.8rem; + line-height: 1.25; } .appcast-download__primary:hover .appcast-download__title, .appcast-download[data-appcast-open="true"] .appcast-download__title, .appcast-download__primary:focus-visible .appcast-download__title { - color: var(--accent); + color: var(--signal); } .appcast-download__panel { position: absolute; - top: calc(100% + 0.55rem); - right: 0; - z-index: 12; + top: calc(100% + 0.65rem); + left: 0; + z-index: 20; display: grid; - gap: 0.3rem; + gap: 0.38rem; width: max-content; - max-width: calc(100vw - 1.5rem); - min-width: 0; - padding: 0.55rem; - border: 1px solid var(--border); - border-radius: 1rem; - background: color-mix(in srgb, var(--panel) 94%, var(--bg-soft)); - box-shadow: 0 20px 45px color-mix(in srgb, var(--ink) 12%, transparent); + min-width: min(18rem, calc(100vw - 2rem)); + max-width: calc(100vw - 2rem); + padding: 0.65rem; + border: 1px solid var(--stage-border); + border-radius: 0.7rem; + background: #121924; + box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35); + color: var(--stage-ink); opacity: 0; pointer-events: none; - transform: translateY(-0.18rem); + transform: translateY(-0.25rem); transition: opacity 160ms ease, transform 160ms ease; @@ -554,13 +546,11 @@ code { } .appcast-download__panel-label { - font-size: 0.68rem; - font-weight: 700; - letter-spacing: 0.08em; - line-height: 1.1; + color: var(--stage-muted); + font-size: 0.72rem; + font-weight: 780; + line-height: 1.2; text-transform: uppercase; - color: var(--muted-soft); - margin-bottom: 0.1rem; } .appcast-download__list { @@ -573,88 +563,58 @@ code { .appcast-download__version { display: grid; - gap: 0.02rem; - padding: 0.36rem 0.42rem; - border-radius: 0.8rem; - border: 1px solid transparent; - background: transparent; - transition: - border-color 160ms ease, - background-color 160ms ease, - transform 160ms ease; + gap: 0.05rem; + padding: 0.48rem 0.52rem; + border-radius: 0.45rem; } .appcast-download__version:hover, .appcast-download__version:focus-visible { - border-color: color-mix(in srgb, var(--accent) 18%, var(--border)); - background: color-mix(in srgb, var(--accent-soft) 82%, var(--panel)); - transform: translateX(0.08rem); + background: rgba(255, 255, 255, 0.08); + color: var(--signal); } .appcast-download__version-title { - font-size: 0.82rem; - font-weight: 800; - letter-spacing: 0; - line-height: 1.1; - color: var(--ink); -} - -.appcast-download__version-meta { - font-size: 0.61rem; - line-height: 1.3; - color: var(--muted); + font-size: 0.9rem; + font-weight: 780; } +.appcast-download__version-meta, .appcast-download__empty { - padding: 0.1rem 0.05rem; - font-size: 0.72rem; - line-height: 1.4; - color: var(--muted); + color: var(--stage-muted); + font-size: 0.78rem; } .reset-inline { display: inline-flex; + flex-wrap: wrap; align-items: center; - justify-content: flex-start; - gap: 0.9rem; - width: fit-content; + gap: 0.45rem 0.7rem; max-width: 100%; - min-width: 0; - font-size: 0.9rem; - line-height: 1.45; - color: var(--muted); + color: var(--stage-soft); + font-size: 0.92rem; + line-height: 1.25; } .reset-inline__question { - min-width: 0; - color: var(--ink); - font-size: 0.82rem; - font-weight: 680; - letter-spacing: 0; - line-height: 1.1; + color: var(--stage-ink); + font-weight: 760; } .reset-inline__answer { display: inline-flex; align-items: center; - gap: 0.34rem; - flex-shrink: 0; - padding: 0; - border: 0; - background: none; - font-size: 0.82rem; - font-weight: 680; - letter-spacing: 0; - color: var(--ink); - white-space: nowrap; + gap: 0.35rem; + color: var(--stage-soft); + font-weight: 760; } .reset-inline__dot { - width: 0.54rem; - height: 0.54rem; + width: 0.48rem; + height: 0.48rem; border-radius: 999px; - background: var(--muted-soft); - box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--muted-soft) 18%, transparent); + background: var(--stage-muted); + box-shadow: 0 0 0 0.18rem rgba(119, 131, 151, 0.18); } .reset-inline--positive .reset-inline__answer { @@ -667,1496 +627,777 @@ code { } .reset-inline--neutral .reset-inline__answer { - color: var(--accent); + color: var(--signal); } .reset-inline--neutral .reset-inline__dot { - background: var(--accent); - box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--accent) 20%, transparent); + background: var(--signal); + box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--signal) 22%, transparent); } -.reset-inline--muted .reset-inline__answer { - color: var(--ink-soft); +.site-section { + width: min(100%, 82rem); + margin: 0 auto; + padding: 4rem 1.15rem 0; } -.reset-stack { - display: flex; - align-items: center; +.section-heading { + display: grid; + grid-template-columns: minmax(0, 1fr); gap: 0.65rem; - width: fit-content; - max-width: 100%; - min-width: 0; - padding: 0.35rem 0; - justify-self: end; - margin-left: auto; - color: var(--ink); -} - -.reset-stack__question { - font-size: 1.28rem; - font-weight: 800; - letter-spacing: 0; - line-height: 1.02; - color: var(--ink); + margin-bottom: 1.35rem; } -.reset-stack__answer { - display: inline-flex; - align-items: center; - gap: 0.4rem; - width: fit-content; - padding: 0.3rem 0.62rem; - border: 1px solid var(--border); - border-radius: 999px; - background: var(--bg-soft); - font-size: 0.82rem; - font-weight: 800; - letter-spacing: 0; +.section-heading h2 { color: var(--ink); - white-space: nowrap; + font-size: clamp(2.1rem, 4vw, 4rem); + font-weight: 830; + line-height: 0.98; } -.reset-stack__dot { - width: 0.46rem; - height: 0.46rem; - border-radius: 999px; - background: var(--muted-soft); - box-shadow: 0 0 0 0.16rem color-mix(in srgb, var(--muted-soft) 18%, transparent); +.section-heading p { + max-width: 42rem; + color: var(--ink-soft); + font-size: 1rem; + line-height: 1.58; } -.reset-stack--positive .reset-stack__answer { - border-color: var(--success-border); - background: var(--success-soft); - color: var(--success); +.system-loop { + display: grid; + grid-template-columns: minmax(0, 1fr); + border-top: 1px solid var(--border-strong); } -.reset-stack--positive .reset-stack__dot { - background: var(--success); - box-shadow: 0 0 0 0.16rem color-mix(in srgb, var(--success) 18%, transparent); +.system-loop article { + display: grid; + gap: 0.45rem; + min-width: 0; + padding: 1rem 0; + border-bottom: 1px solid var(--border); } -.reset-stack--neutral .reset-stack__answer { - border-color: color-mix(in srgb, var(--accent) 28%, var(--border)); - background: color-mix(in srgb, var(--accent-soft) 86%, var(--panel)); - color: var(--accent); +.system-loop h3 { + color: var(--ink); + font-size: 1.08rem; + font-weight: 800; + line-height: 1.18; } -.signal-source-timeline { - display: grid; - gap: 0.65rem; - margin: 1rem 0 0; - padding: 0; - list-style: none; +.system-loop p { + color: var(--ink-soft); + font-size: 0.94rem; + line-height: 1.55; } -.signal-source-timeline__item { +.radar-layout { display: grid; - grid-template-columns: auto minmax(0, 1fr) auto; + grid-template-columns: minmax(0, 1fr); + gap: 1rem; align-items: start; - column-gap: 0.75rem; - row-gap: 0.15rem; - padding-left: 1rem; - position: relative; } -.signal-source-timeline__item::before { - content: ""; - position: absolute; - left: 0.15rem; - top: 0.25rem; - width: 0.4rem; - height: 0.4rem; - border-radius: 999px; - background: var(--accent); - box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--accent) 16%, transparent); +.lead-brief { + display: grid; + align-content: start; + gap: 1rem; + min-width: 0; + padding: 1.2rem; + border: 1px solid var(--border); + border-radius: 0.85rem; + background: var(--panel); } -.signal-source-timeline__item::after { - content: ""; - position: absolute; - left: 0.34rem; - top: 0.9rem; - bottom: -0.8rem; - width: 1px; - background: var(--border); +.lead-brief__meta, +.signal-card__taxonomy { + display: flex; + flex-wrap: wrap; + gap: 0.38rem; + align-items: center; } -.signal-source-timeline__item:last-child::after { - display: none; +.lead-brief__meta span, +.signal-card__taxonomy span { + display: inline-flex; + align-items: center; + min-height: 1.52rem; + padding: 0.28rem 0.48rem; + border: 1px solid var(--border); + border-radius: 999px; + color: var(--muted); + line-height: 1; } -.signal-source-timeline__kind { - font-size: 0.68rem; - line-height: 1.4; - text-transform: uppercase; - letter-spacing: 0.04em; - color: var(--muted); +.lead-brief h3 { + max-width: 16ch; + color: var(--ink); + font-size: clamp(2rem, 4vw, 3.55rem); + font-weight: 820; + line-height: 0.98; } -.signal-source-timeline__title { - min-width: 0; - font-size: 0.9rem; - line-height: 1.45; +.lead-brief__summary { + max-width: 44rem; color: var(--ink-soft); + font-size: 1.03rem; + line-height: 1.58; } -.signal-source-timeline__title:hover { - color: var(--ink); +.lead-brief__action { + display: grid; + gap: 0.35rem; + padding-top: 0.95rem; + border-top: 1px solid var(--border); } -.signal-source-timeline__meta { - font-size: 0.7rem; - line-height: 1.45; - color: var(--muted-soft); - white-space: nowrap; +.lead-brief__action p { + color: var(--ink); + font-size: 0.96rem; + line-height: 1.55; } -.reset-stack--neutral .reset-stack__dot { - background: var(--accent); - box-shadow: 0 0 0 0.16rem color-mix(in srgb, var(--accent) 20%, transparent); +.lead-brief__link { + width: fit-content; + border-color: color-mix(in srgb, var(--signal) 80%, var(--border)); + backdrop-filter: none; } -.reset-stack--muted .reset-stack__answer { - color: var(--ink-soft); +.radar-stack { + display: grid; + gap: 1.15rem; + min-width: 0; } -.release-delta { +.brief-list, +.watch-list { display: grid; - gap: 0.95rem; - margin-top: 1.2rem; - padding: 1rem 0 0.95rem; - background: transparent; + gap: 0.75rem; + min-width: 0; } -.release-delta__control-row { - display: flex; - flex-wrap: wrap; - align-items: baseline; - justify-content: flex-start; - gap: 0.35rem 0.9rem; - padding-bottom: 0; +.brief-list h3, +.watch-list h3, +.feed-toolbar__copy h2 { + color: var(--ink); + font-size: 1rem; + font-weight: 800; + line-height: 1.2; } -.release-delta__hero { +.brief-list ol, +.watch-list ul { display: grid; - gap: 0.78rem; + gap: 0; + margin: 0; padding: 0; + border-top: 1px solid var(--border); + list-style: none; } -.release-delta__hero-head { - display: grid; - grid-template-columns: minmax(0, var(--measure)); - gap: 0.75rem; - align-items: start; +.brief-list li, +.watch-list li { + min-width: 0; + padding: 0.75rem 0; + border-bottom: 1px solid var(--border); } -.release-delta__hero-copy { +.brief-list a, +.watch-list li { display: grid; - gap: 0.38rem; + gap: 0.28rem; } -.release-delta__eyebrow { - color: var(--muted-soft); - font-size: var(--label-size); - font-weight: 720; - letter-spacing: 0.09em; +.brief-list span, +.watch-list span { + color: var(--muted); + font-size: 0.72rem; + font-weight: 780; line-height: 1.2; text-transform: uppercase; } -.release-delta__window-label { - display: inline-flex; - flex-wrap: wrap; - align-items: center; - justify-content: flex-start; - gap: 0.32rem; - color: var(--muted); - font-size: 0.82rem; - line-height: 1.35; -} - -.release-delta__window-label strong { +.brief-list strong { color: var(--ink); - font-size: 0.86rem; - font-weight: 680; - letter-spacing: 0; + font-size: 0.96rem; + font-weight: 760; + line-height: 1.38; } -.release-delta__checkpoint-link { - font-size: 0.82rem; - line-height: 1.35; +.brief-list a:hover strong { + color: var(--accent-strong); } -.release-delta__title { - margin: 0; - color: var(--ink); - font-size: 1.1rem; - font-weight: 700; - letter-spacing: 0; - line-height: 1.22; +.watch-list p { + color: var(--ink-soft); + font-size: 0.9rem; + line-height: 1.5; } -.release-delta__hero-subcopy { - max-width: var(--measure); - margin: 0; - color: var(--ink-soft); - font-size: 0.93rem; - line-height: 1.56; +.publisher-board { + display: grid; + grid-template-columns: minmax(0, 1fr); + gap: 1rem; + align-items: stretch; + border-top: 1px solid var(--border-strong); + border-bottom: 1px solid var(--border-strong); } -.release-delta__comparison { +.publisher-note { display: grid; - gap: 0.9rem; + gap: 0.45rem; + padding: 1.1rem 0; +} + +.publisher-note p { + max-width: 46rem; + color: var(--ink-soft); + font-size: 1rem; + line-height: 1.6; } -.release-delta__content-grid { +.publisher-flow { display: grid; - gap: var(--content-gap); - padding-top: 0.2rem; + grid-template-columns: minmax(0, 1fr); + gap: 0; } -.release-delta__radar-strip { +.publisher-flow span { display: flex; align-items: center; - width: 100%; - padding: 0.18rem 0 0.08rem; + min-height: 3rem; + padding: 0.82rem 0; + border-top: 1px solid var(--border); + color: var(--ink); + font-size: 0.92rem; + text-transform: none; } -.release-delta__radar-strip-line { - position: relative; - flex: 1 1 auto; - height: 1px; - background: color-mix(in srgb, var(--border) 84%, transparent); - overflow: hidden; +.feed-section { + padding-bottom: 5rem; } -.release-delta__radar-strip-line::after { - content: ""; - position: absolute; - inset: 0; - background: linear-gradient( - 90deg, - transparent 0%, - transparent 28%, - color-mix(in srgb, var(--accent) 18%, transparent) 42%, - color-mix(in srgb, var(--accent) 52%, transparent) 50%, - color-mix(in srgb, var(--accent) 18%, transparent) 58%, - transparent 72%, - transparent 100% - ); - background-size: 220% 100%; - background-repeat: no-repeat; - background-position: 200% 0; - opacity: 0.82; - animation: release-delta-radar-shimmer 2.8s linear infinite; +.feed-toolbar { + display: grid; + grid-template-columns: minmax(0, 1fr); + gap: 1rem; + align-items: end; + padding-top: 1.1rem; + border-top: 1px solid var(--border-strong); } -:root[data-theme="light"] { - .release-delta__radar-strip-line { - background: color-mix(in srgb, var(--accent) 56%, var(--border)); - } +.feed-toolbar__copy { + display: grid; + gap: 0.3rem; +} - .release-delta__radar-strip-line::after { - background-image: linear-gradient( - 90deg, - transparent 0%, - transparent 24%, - color-mix(in srgb, var(--link) 72%, transparent) 38%, - color-mix(in srgb, var(--link) 100%, transparent) 46%, - color-mix(in srgb, #ffffff 78%, var(--link)) 50%, - color-mix(in srgb, var(--link) 100%, transparent) 54%, - color-mix(in srgb, var(--link) 72%, transparent) 62%, - transparent 76%, - transparent 100% - ); - opacity: 0.92; - } +.feed-toolbar__copy p { + max-width: 44rem; + color: var(--ink-soft); + font-size: 0.95rem; + line-height: 1.55; } -@media (prefers-color-scheme: light) { - :root:not([data-theme]), - :root[data-theme="system"] { - .release-delta__radar-strip-line { - background: color-mix(in srgb, var(--accent) 56%, var(--border)); - } - - .release-delta__radar-strip-line::after { - background-image: linear-gradient( - 90deg, - transparent 0%, - transparent 24%, - color-mix(in srgb, var(--link) 72%, transparent) 38%, - color-mix(in srgb, var(--link) 100%, transparent) 46%, - color-mix(in srgb, #ffffff 78%, var(--link)) 50%, - color-mix(in srgb, var(--link) 100%, transparent) 54%, - color-mix(in srgb, var(--link) 72%, transparent) 62%, - transparent 76%, - transparent 100% - ); - opacity: 0.92; - } - } +.filter-bar { + display: flex; + flex-wrap: wrap; + gap: 0.42rem; +} + +.filter-chip { + display: inline-flex; + align-items: center; + justify-content: center; + min-height: 2rem; + padding: 0.45rem 0.72rem; + border: 1px solid var(--border); + border-radius: 999px; + color: var(--muted); + font-size: 0.78rem; + font-weight: 760; + line-height: 1; +} + +.filter-chip:hover, +.filter-chip[data-active="true"] { + border-color: var(--ink); + background: var(--ink); + color: var(--panel); +} + +.feed-region { + display: grid; + gap: 1.6rem; + margin-top: 1.1rem; +} + +.feed-region--filtering { + animation: feed-filter-shift 180ms ease; } -@keyframes release-delta-radar-shimmer { +@keyframes feed-filter-shift { 0% { - background-position: 200% 0; + opacity: 0.55; + transform: translateY(0.2rem); } 100% { - background-position: -20% 0; + opacity: 1; + transform: translateY(0); } } -.release-delta__state { +.feed-group { display: grid; - gap: 0.68rem; - align-self: start; - padding-left: 1.15rem; - border-left: 1px solid var(--border); + gap: 0.75rem; } -.release-delta__state-list { - display: grid; - gap: 0; - margin: 0; +.feed-group__label { + color: var(--muted); + font-size: 0.78rem; + font-weight: 780; + line-height: 1.2; + text-transform: uppercase; } -.release-delta__criteria-list { +.feed-group__items { display: grid; - gap: 0.55rem; - margin: 0; - padding: 0; - list-style: none; + gap: 0.8rem; } -.release-delta__criteria-item { - position: relative; - padding-left: 0.85rem; - color: var(--ink-soft); - font-size: 0.82rem; - line-height: 1.5; +.signal-card { + display: grid; + grid-template-columns: minmax(0, 1fr); + gap: 0.75rem; + min-width: 0; + padding: 1rem 0 1.1rem; + border-top: 1px solid var(--border); + scroll-margin-top: 1rem; } -.release-delta__criteria-item::before { - position: absolute; - top: 0.62em; - left: 0; - width: 0.26rem; - height: 0.26rem; - border-radius: 999px; - background: var(--muted-soft); - content: ""; +.signal-card[hidden], +.feed-group[hidden], +.empty-feed-state[hidden] { + display: none; } -.release-delta__state-row { - display: grid; - grid-template-columns: minmax(0, 1fr) auto; - align-items: baseline; - gap: 0.9rem; - padding: 0.42rem 0; - border-bottom: 1px solid var(--border); +.signal-card:target { + border-top-color: var(--accent); } -.release-delta__state-row dt { +.signal-card__index { + display: flex; + flex-wrap: wrap; + gap: 0.45rem 0.75rem; + align-content: start; color: var(--muted); - font-size: 0.82rem; - line-height: 1.45; -} - -.release-delta__state-row dd { - margin: 0; - color: var(--ink-soft); - font-size: 0.82rem; - font-weight: 620; - line-height: 1.2; + font-size: 0.78rem; + font-weight: 760; + line-height: 1.3; } -.release-delta__state-copy { - margin: 0; - color: var(--ink-soft); - font-size: 0.82rem; - line-height: 1.58; +.signal-card__index a { + color: var(--accent-strong); } -.release-delta__overview { +.signal-card__body { display: grid; - gap: 0.72rem; - padding: 0; + gap: 0.9rem; + min-width: 0; } -.release-delta__overview-head { +.signal-card__header { display: grid; - gap: 0.22rem; + gap: 0.5rem; } -.release-delta__overview-head > div { - display: grid; - grid-template-columns: minmax(6.75rem, var(--rail-width)) minmax(0, 1fr); - column-gap: var(--content-gap); - align-items: baseline; +.signal-card__preview { + color: var(--accent-strong); + font-size: 0.72rem; + font-weight: 780; + line-height: 1.2; + text-transform: uppercase; } -.release-delta__overview-title { - font-size: 0.94rem; - font-weight: 700; - line-height: 1.22; - letter-spacing: 0; +.signal-card__header h2 { + max-width: 54rem; color: var(--ink); + font-size: clamp(1.28rem, 2.2vw, 1.8rem); + font-weight: 800; + line-height: 1.12; } -.release-delta__overview-list { - display: grid; - gap: 0.95rem; - margin: 0; - padding: 0; - list-style: none; +.signal-card__summary { + max-width: 55rem; + color: var(--ink-soft); + font-size: 0.98rem; + line-height: 1.62; } -.release-overview-card { +.signal-card__readout { display: grid; - gap: 0.7rem; - padding-top: 1rem; - border-top: 1px solid var(--border); -} - -.release-overview-card:first-child { - padding-top: 0; - border-top: 0; -} - -.release-overview-card { grid-template-columns: minmax(0, 1fr); - align-items: start; + gap: 0.75rem; + padding: 0.95rem 0; + border-top: 1px solid var(--border); + border-bottom: 1px solid var(--border); } -.release-overview-card__body { +.signal-card__readout section { display: grid; - grid-template-columns: minmax(6.75rem, var(--rail-width)) minmax(0, 1fr); - grid-template-areas: - "meta title" - ". why" - ". details" - ". action"; - column-gap: var(--content-gap); - row-gap: 0.42rem; + gap: 0.32rem; min-width: 0; } -.release-overview-card__meta { - grid-area: meta; - padding-top: 0.14rem; - color: var(--muted-soft); - font-size: var(--label-size); - font-weight: 720; - letter-spacing: 0.09em; - text-transform: uppercase; -} - -.release-overview-card__title { - grid-area: title; - width: fit-content; - color: var(--ink); - font-size: 0.95rem; - line-height: 1.28; -} - -.release-overview-card__title:hover { - color: var(--link); -} - -.release-overview-card__why { - grid-area: why; - max-width: var(--measure); +.signal-card__readout p { color: var(--ink-soft); - font-size: 0.91rem; - line-height: 1.58; -} - -.release-overview-card__details { - grid-area: details; - display: grid; - gap: 0.85rem 1.5rem; - grid-template-columns: repeat(2, minmax(0, 1fr)); - padding-top: 0.18rem; + font-size: 0.92rem; + line-height: 1.55; } -.release-overview-card__detail { +.signal-card__effect, +.signal-card__watch { display: grid; - gap: 0.28rem; - padding: 0; -} - -.release-overview-card__label { - color: var(--muted-soft); - font-size: var(--label-size); - font-weight: 720; - letter-spacing: 0.09em; - text-transform: uppercase; -} - -.release-overview-card__detail-body { + gap: 0.3rem; color: var(--ink-soft); - font-size: 0.88rem; - line-height: 1.58; -} - -.release-overview-card__action { - grid-area: action; - width: fit-content; - margin-top: 0.12rem; - font-size: 0.86rem; - line-height: 1.45; + font-size: 0.9rem; + line-height: 1.55; } -.release-delta__summary-rail { +.signal-card__flags { display: flex; flex-wrap: wrap; - gap: 0.55rem 1.35rem; + gap: 0.42rem; align-items: center; - padding: 0; - border: 0; -} - -.release-delta__summary-rail--hero { - padding: 0; - border: 0; } -.release-delta__summary-item { +.signal-flag { display: inline-flex; + max-width: 100%; + min-height: 1.8rem; align-items: center; - gap: 0.25rem; - color: var(--muted); - font-size: 0.84rem; - line-height: 1.45; - white-space: nowrap; + padding: 0.32rem 0.5rem; + overflow-wrap: anywhere; } -.release-delta__summary-item strong { - color: var(--ink-soft); - font-size: inherit; - font-weight: 620; - letter-spacing: 0; -} - -.release-delta__panel-label { - color: var(--muted-soft); - font-size: var(--label-size); - font-weight: 720; - letter-spacing: 0.09em; - text-transform: uppercase; -} - -.release-delta__empty { - font-size: 0.84rem; - line-height: 1.5; - color: var(--muted); -} - -.sr-only { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - clip: rect(0, 0, 0, 0); - white-space: nowrap; - border: 0; -} - -.feed-toolbar { - display: grid; - gap: 0.9rem var(--content-gap); - align-items: flex-start; - margin-top: 1rem; - padding: 0.95rem 0 0.2rem; +.signal-card__evidence { + padding-top: 0.65rem; border-top: 1px solid var(--border); } -.feed-toolbar__intro { - display: grid; - gap: 0.45rem var(--content-gap); - align-items: start; -} - -.feed-toolbar__controls { +.signal-card__evidence summary { display: flex; - flex-direction: column; - gap: 0.7rem; - align-items: flex-start; -} - -.filter-bar { - display: flex; - flex-wrap: wrap; align-items: center; - gap: 0.45rem 1.15rem; -} - -.filter-chip { - border-bottom: 2px solid transparent; - padding: 0 0 0.5rem; - color: var(--muted); - font-size: var(--label-size); - font-weight: 700; - letter-spacing: 0.1em; - text-transform: uppercase; - transition: - color 160ms ease, - border-color 160ms ease, - transform 180ms ease; -} - -.filter-chip:hover { - color: var(--ink); - border-color: var(--border-strong); -} - -.filter-chip[data-active="true"] { - color: var(--ink); - border-color: var(--ink); -} - -.feed-toolbar__label { - color: var(--muted); - font-size: var(--label-size); - font-weight: 720; - letter-spacing: 0.09em; - text-transform: uppercase; -} - -.feed-toolbar__summary { - max-width: var(--measure); - color: var(--ink-soft); - font-size: 0.92rem; - line-height: 1.55; -} - -.feed-region { - margin-top: 0.75rem; - display: flex; - flex-direction: column; - gap: 1.8rem; -} - -.feed-region--filtering { - animation: feed-filter-shift 180ms ease; -} - -@keyframes feed-filter-shift { - 0% { - opacity: 0.72; - transform: translateY(4px); - } - - 100% { - opacity: 1; - transform: translateY(0); - } -} - -.feed-group { - display: flex; - flex-direction: column; - gap: 0.9rem; -} - -.feed-group__label { - display: flex; - align-items: center; - gap: 0; -} - -.feed-group__label span { - color: var(--muted-soft); - font-size: var(--label-size); - font-weight: 720; - letter-spacing: 0.09em; - text-transform: uppercase; -} - -.signal-card { - display: grid; - gap: 0.85rem var(--content-gap); - padding: 1.2rem 0; - border-top: 1px solid var(--border); - scroll-margin-top: 1.5rem; - transition: - background-color 180ms ease, - border-color 180ms ease, - box-shadow 180ms ease, - transform 180ms ease; -} - -.signal-card:first-child { - border-top: 0; - padding-top: 0; -} - -.signal-card:target { - margin-inline: -0.85rem; - padding: 1rem 0.85rem; - border-top-color: color-mix(in srgb, var(--accent) 35%, var(--border)); - border-radius: 0.8rem; - background: color-mix(in srgb, var(--accent-soft) 52%, var(--panel)); - box-shadow: - inset 0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent), - 0 10px 24px color-mix(in srgb, var(--accent) 8%, transparent); -} - -.signal-card:target .signal-entry__title { - color: color-mix(in srgb, var(--accent) 74%, var(--ink)); -} - -.signal-card:target .signal-entry-date, -.signal-card:target .signal-entry__taxonomy-item--accent { - color: var(--accent); -} - -.signal-entry__rail { - display: flex; - flex-direction: column; - gap: 0.5rem; -} - -.signal-entry-date { + justify-content: space-between; + gap: 0.8rem; color: var(--muted); - font-size: var(--label-size); - font-weight: 720; - letter-spacing: 0.09em; - text-transform: uppercase; -} - -.signal-entry__taxonomy { - display: flex; - flex-wrap: wrap; - gap: 0.36rem; -} - -.signal-entry__taxonomy-item { - color: var(--muted-soft); - font-size: var(--label-size); - font-weight: 650; - letter-spacing: 0.06em; - text-transform: uppercase; -} - -.signal-entry__taxonomy-item--accent { - color: var(--ink); -} - -.signal-entry__content { - min-width: 0; -} - -.signal-entry__preview { - color: var(--link); - font-size: var(--label-size); - font-weight: 700; - letter-spacing: 0.09em; - text-transform: uppercase; -} - -.signal-entry__title { - max-width: 48rem; - font-size: 1.08rem; - font-weight: 700; - line-height: 1.22; - color: var(--ink); -} - -.signal-entry__summary { - max-width: var(--measure); - font-size: 0.94rem; - line-height: 1.62; - color: var(--ink-soft); + cursor: pointer; + font-size: 0.82rem; + font-weight: 760; + line-height: 1.25; + list-style: none; } -.signal-entry__why { - display: flex; - flex-direction: column; - gap: 0.3rem; - max-width: var(--measure); - font-size: 0.91rem; - line-height: 1.62; - color: var(--ink); +.signal-card__evidence summary::-webkit-details-marker { + display: none; } -.signal-entry-label { +.signal-card__evidence summary span:last-child { color: var(--muted-soft); - font-size: var(--label-size); - font-weight: 720; - letter-spacing: 0.09em; - text-transform: uppercase; -} - -.signal-entry-action { - margin-top: 0.9rem; - padding-top: 0.9rem; - border-top: 1px solid var(--border); -} - -.signal-entry-action__row, -.signal-entry-action__effect { - display: grid; - grid-template-columns: minmax(6.75rem, var(--rail-width)) minmax(0, 1fr); - gap: 0.28rem var(--content-gap); - align-items: start; -} - -.signal-entry-action__row { - color: var(--ink); - font-size: 0.91rem; - line-height: 1.62; -} - -.signal-entry-action__body { - display: inline; -} - -.signal-entry-action__effect { - margin-top: 0.6rem; - color: var(--muted); - font-size: 0.89rem; - line-height: 1.58; -} - -.signal-entry-config { - margin-top: 0.8rem; -} - -.signal-entry-config__hint { - margin-top: 0.28rem; - color: var(--muted); - font-size: 0.84rem; - line-height: 1.5; -} - -.terminal-inline { - display: inline-flex; - align-items: center; - border-radius: 999px; - border: 1px solid var(--success-border); - background: var(--success-soft); - padding: 0.12rem 0.45rem; - color: var(--success); - font-family: var(--font-mono); - font-size: 0.7rem; - font-weight: 700; - letter-spacing: 0.04em; -} - -.signal-flag { - border: 1px solid var(--border); - border-radius: 999px; - background: var(--bg-soft); - padding: 0.2rem 0.58rem; - color: var(--muted); - font-size: 0.74rem; -} - -.signal-entry-details { - margin-top: 0.9rem; - padding-top: 0.85rem; - border-top: 1px solid var(--border); - color: var(--ink-soft); -} - -.signal-entry-details__summary { - display: flex; - align-items: center; - justify-content: space-between; - gap: 1rem; - cursor: pointer; - list-style: none; - color: var(--muted); - font-size: 0.68rem; + font-size: 0.76rem; font-weight: 700; - letter-spacing: 0.12em; - text-transform: uppercase; } -.signal-entry-details__summary::-webkit-details-marker { - display: none; +.signal-card__evidence-body { + display: grid; + gap: 0.9rem; + padding-top: 0.85rem; } -.signal-entry-details__body { - padding-top: 0.8rem; +.signal-proof-list { + display: grid; + gap: 0.5rem; + margin: 0; + padding: 0; + list-style: none; } .signal-proof-item { position: relative; padding-left: 0.9rem; + color: var(--ink-soft); + font-size: 0.9rem; + line-height: 1.55; } .signal-proof-item::before { + content: ""; position: absolute; + top: 0.64em; left: 0; - top: 0.72rem; - width: 0.24rem; - height: 0.24rem; + width: 0.32rem; + height: 0.32rem; border-radius: 999px; - background: var(--ink); - content: ""; + background: var(--accent); } -.signal-link { - color: var(--link); - font-weight: 600; +.signal-card__caveats { + display: grid; + gap: 0.45rem; } -.signal-link:hover { - text-decoration: underline; - text-underline-offset: 0.18em; +.signal-source-list { + display: grid; + gap: 0.45rem; + margin: 0; + padding: 0.75rem 0 0; + border-top: 1px solid var(--border); + list-style: none; } -.signal-markdown code { - border: 1px solid var(--code-border); - border-radius: 0.42rem; - background: var(--code-bg); - padding: 0.12rem 0.34rem; - color: var(--accent); - font-size: 0.9em; +.signal-source-list li { + display: grid; + grid-template-columns: auto minmax(0, 1fr) auto; + gap: 0.55rem; + align-items: baseline; + color: var(--muted); + font-size: 0.82rem; + line-height: 1.35; } -.signal-markdown a { - color: var(--link); - text-decoration: underline; - text-decoration-color: var(--link-underline); - text-underline-offset: 0.18em; +.signal-source-list span, +.signal-source-list small { + color: var(--muted); + font-size: 0.72rem; + font-weight: 780; + text-transform: uppercase; } -.signal-markdown strong { - color: var(--ink); +.signal-source-list a { + color: var(--ink-soft); } -.signal-markdown--title code { - font-size: 0.74em; +.signal-source-list a:hover { + color: var(--accent-strong); } -@media (min-width: 768px) { - .site-frame { - padding: 1.45rem 1.55rem 5.5rem; - } +.empty-feed-state { + display: grid; + gap: 0.45rem; + padding: 1.1rem; + border: 1px dashed var(--border-strong); + border-radius: 0.7rem; + background: var(--panel); +} - .site-topbar { - gap: 1rem; - } +.empty-feed-state > p:first-child { + color: var(--muted); + font-size: 0.72rem; + font-weight: 780; + text-transform: uppercase; +} - .site-topbar__head { - grid-template-columns: minmax(0, 1fr) minmax(18rem, 23rem); - grid-template-areas: - "logo utility" - "note utility" - "social utility"; - align-items: start; - column-gap: 2.25rem; - row-gap: 0.65rem; - } +.empty-feed-state h2 { + color: var(--ink); + font-size: 1.35rem; + font-weight: 800; + line-height: 1.15; +} - .site-head__logo { - grid-area: logo; - } +.empty-feed-state p { + color: var(--ink-soft); + font-size: 0.95rem; + line-height: 1.55; +} - .site-head__utility { - grid-area: utility; - } +.signal-markdown a, +.signal-link { + color: var(--accent-strong); + text-decoration: underline; + text-decoration-color: color-mix(in srgb, var(--accent) 38%, transparent); + text-underline-offset: 0.18em; +} - .site-brand__note { - grid-area: note; - } +.signal-markdown--title code { + font-size: 0.82em; +} - .site-head__status { - grid-area: status; - } +.signal-markdown--inline code { + white-space: normal; +} - .site-brand__social { - grid-area: social; +@media (prefers-reduced-motion: reduce) { + *, + *::before, + *::after { + animation-duration: 1ms !important; + animation-iteration-count: 1 !important; + scroll-behavior: auto !important; + transition-duration: 1ms !important; } +} - .site-head__actions { - grid-area: actions; +@media (min-width: 720px) { + .site-nav { + display: flex; } - .site-head__utility > .site-head__theme, - .site-head__utility > .site-head__status, - .site-head__utility > .site-head__actions { - grid-area: auto; + .hero-grid { + grid-template-columns: minmax(0, 1fr) minmax(19rem, 25rem); + gap: 2rem; + padding-top: 2.8rem; } - .site-brand__wordmark-image { - height: 2.72rem; + .hero-console { + align-self: end; } - .site-brand__meta { - grid-template-rows: repeat(2, auto); - gap: 0.72rem; + .hero-bottom { + grid-template-columns: repeat(4, minmax(0, 1fr)); } - .site-brand__note { - max-width: var(--measure); + .hero-bottom div:nth-child(2n) { + border-right: 1px solid var(--stage-border); } - .site-brand__social { - min-width: 0; - padding-top: 0; + .hero-bottom div:last-child { + border-right: 0; } - .site-brand__social-copy { - white-space: nowrap; + .system-loop { + grid-template-columns: repeat(4, minmax(0, 1fr)); } - .site-head__utility { - min-height: 0; - align-content: start; - justify-items: end; - padding-top: 0; + .system-loop article { + padding: 1rem 1rem 1.1rem; + border-right: 1px solid var(--border); } - .site-head__actions { - align-items: flex-start; + .system-loop article:first-child { + padding-left: 0; } - .site-brand__cues { - justify-content: flex-end; + .system-loop article:last-child { + padding-right: 0; + border-right: 0; } - .release-delta { - margin-top: 1.1rem; - padding: 0.95rem 0 0.85rem; + .radar-layout { + grid-template-columns: minmax(0, 1.45fr) minmax(19rem, 0.8fr); + gap: 1.15rem; } - .release-delta__hero-head { - grid-template-columns: minmax(0, var(--measure)); + .publisher-board { + grid-template-columns: minmax(0, 1fr) minmax(22rem, 0.72fr); + gap: 2rem; } - .release-delta__content-grid { - grid-template-columns: minmax(0, 1fr) 14.75rem; - align-items: start; + .publisher-flow span:first-child { + border-top: 0; } .feed-toolbar { grid-template-columns: minmax(0, 1fr) auto; - align-items: start; - } - - .feed-toolbar__intro { - grid-template-columns: minmax(6.75rem, var(--rail-width)) minmax(0, var(--measure)); - align-items: start; - } - - .feed-toolbar__controls { - flex-direction: row; - align-items: center; - gap: 1rem; } .signal-card { - grid-template-columns: var(--rail-width) minmax(0, 1fr); - } - - .signal-entry__taxonomy { - flex-direction: column; - align-items: flex-start; - } -} - -@media (max-width: 52rem) { - .site-topbar__head { - grid-template-columns: minmax(0, 1fr); - gap: 0.85rem; - } - - .site-brand__note { - max-width: none; - } - - .site-head__theme, - .site-head__utility, - .site-head__cues, - .site-head__actions, - .site-head__status { - justify-content: flex-start; + grid-template-columns: 9.5rem minmax(0, 1fr); + gap: 1.4rem; + padding: 1.25rem 0 1.35rem; } - .site-head__utility { - justify-items: start; + .signal-card__index { + display: grid; + gap: 0.4rem; } - .site-brand__social-copy { - white-space: normal; - } - - .site-brand__cues { - justify-content: flex-start; - } - - .reset-inline { - flex-wrap: wrap; - justify-content: flex-start; - } - - .appcast-download { - width: 100%; + .signal-card__readout { + grid-template-columns: repeat(2, minmax(0, 1fr)); } +} - .appcast-download__primary { - align-items: flex-start; - width: fit-content; +@media (min-width: 1040px) { + .official-hero { + min-height: min(48rem, 100vh); } - .appcast-download__kicker, - .appcast-download__title-row { - justify-content: flex-start; + .hero-grid { + grid-template-columns: minmax(0, 1fr) minmax(22rem, 28rem); + padding-top: 3.2rem; } - .appcast-download__meta { - text-align: left; + .hero-copy h1 { + font-size: clamp(7rem, 11vw, 10.8rem); } - .appcast-download__panel { - left: 0; - right: auto; - min-width: min(18rem, calc(100vw - 3rem)); + .lead-brief { + padding: 1.6rem; } +} - .release-overview-card__details { - grid-template-columns: minmax(0, 1fr); +@media (max-width: 520px) { + .official-hero { + min-height: 100vh; } - .release-overview-card__body { - grid-template-columns: minmax(0, 1fr); - grid-template-areas: - "meta" - "title" - "why" - "details" - "action"; - row-gap: 0.4rem; + .site-header { + grid-template-columns: minmax(0, 1fr) auto; + padding: 0.85rem 0.9rem; } - .release-delta__overview-head > div { - grid-template-columns: minmax(0, 1fr); - row-gap: 0.22rem; + .site-logo__image { + height: 2.05rem; } - .release-delta__hero-head { - grid-template-columns: minmax(0, 1fr); + .theme-toggle { + max-width: 10.2rem; + overflow-x: auto; } - .release-delta__state { - padding-top: 0.85rem; - padding-left: 0; - border-top: 1px solid var(--border); - border-left: 0; + .theme-toggle__button { + padding-inline: 0.56rem; } - .signal-entry-action__row, - .signal-entry-action__effect { - grid-template-columns: minmax(0, 1fr); + .hero-grid { + padding: 2.6rem 0.9rem 1rem; } -} - -/* Homepage redesign: compact reader-first dashboard layout. */ -.site-frame { - max-width: 74rem; - padding-top: 1.2rem; -} - -.site-topbar { - padding-bottom: 1rem; -} - -.site-topbar__head { - display: grid; - grid-template-columns: minmax(0, 1fr); - grid-template-areas: none; - gap: 1rem; -} - -.site-brand__main { - display: grid; - grid-area: auto; - gap: 0.5rem; - max-width: 43rem; - min-width: 0; -} - -.site-brand__main > .site-head__logo, -.site-brand__main > .site-brand__note, -.site-brand__main > .site-brand__social { - grid-area: auto; -} - -.site-brand__wordmark-image { - height: 2.55rem; -} - -.site-brand__eyebrow { - color: var(--muted-soft); - font-size: var(--label-size); - font-weight: 720; - letter-spacing: 0.1em; - line-height: 1.2; - text-transform: uppercase; -} - -.site-brand__title { - max-width: 40rem; - color: var(--ink); - font-size: 1.72rem; - font-weight: 720; - line-height: 1.08; -} - -.site-brand__note { - max-width: 40rem; - font-size: 0.94rem; - line-height: 1.55; -} - -.site-brand__social { - display: flex; - flex-wrap: wrap; - align-items: baseline; - gap: 0.35rem 0.55rem; - width: fit-content; -} - -.site-brand__social-copy { - max-width: none; - font-size: 0.78rem; -} - -.site-head__utility { - display: grid; - grid-area: auto; - grid-template-columns: minmax(0, 1fr); - gap: 0.55rem; - align-content: start; - justify-items: start; - min-width: 0; - padding: 0.8rem 0 0; - border-top: 1px solid var(--border); -} - -.site-head__theme, -.site-head__status, -.site-head__actions { - justify-content: flex-start; -} - -.reset-inline { - gap: 0.48rem; - font-size: 0.82rem; - line-height: 1.3; -} - -.appcast-download__body { - align-items: flex-start; -} - -.appcast-download__kicker, -.appcast-download__title-row { - justify-content: flex-start; -} - -.appcast-download__meta { - text-align: left; -} - -.release-delta { - margin-top: 1.05rem; - padding: 1rem 0 0.95rem; -} - -.release-delta__control-row { - gap: 0.35rem 0.85rem; -} - -.release-delta__hero { - gap: 0.68rem; -} - -.release-delta__hero-head { - grid-template-columns: minmax(0, 42rem); -} - -.release-delta__title { - font-size: 1.05rem; -} - -.release-delta__hero-subcopy { - max-width: 39rem; - font-size: 0.9rem; -} - -.release-delta__summary-rail { - gap: 0.45rem 1.1rem; -} - -.release-delta__content-grid { - grid-template-columns: minmax(0, 1fr); - gap: 1.15rem; -} - -.release-delta__overview-head > div, -.release-overview-card__body { - grid-template-columns: minmax(0, 1fr); - grid-template-areas: - "meta" - "title" - "why" - "details" - "action"; - row-gap: 0.36rem; -} -.release-delta__overview-head > div { - grid-template-areas: - "meta" - "title"; -} - -.release-overview-card { - padding-top: 0.95rem; -} - -.release-overview-card__meta { - padding-top: 0; -} - -.release-overview-card__details { - grid-template-columns: minmax(0, 1fr); - gap: 0.75rem; -} - -.release-delta__state { - padding: 0.95rem 0 0; - border-top: 1px solid var(--border); - border-left: 0; -} - -.release-delta__criteria-list { - grid-template-columns: minmax(0, 1fr); -} - -.feed-toolbar { - grid-template-columns: minmax(0, 1fr); - gap: 0.9rem; - margin-top: 0.7rem; - padding-top: 0.95rem; -} - -.feed-toolbar__intro { - grid-template-columns: minmax(0, 1fr); - gap: 0.3rem; -} - -.feed-toolbar__summary { - max-width: 42rem; -} - -.filter-bar { - gap: 0.4rem 0.9rem; -} - -.signal-card { - grid-template-columns: minmax(0, 1fr); - gap: 0.65rem; - padding: 1.05rem 0; -} - -.signal-entry__rail { - flex-direction: row; - flex-wrap: wrap; - align-items: center; - gap: 0.45rem 0.75rem; -} - -.signal-entry__taxonomy { - flex-direction: row; - align-items: center; -} - -.signal-entry__title { - max-width: 48rem; - font-size: 1.04rem; -} - -.signal-entry__summary, -.signal-entry__why { - max-width: 48rem; -} - -.signal-entry-action__row, -.signal-entry-action__effect { - grid-template-columns: minmax(0, 1fr); - gap: 0.26rem; -} - -@media (min-width: 768px) { - .site-topbar__head { - grid-template-columns: minmax(0, 1fr) minmax(15.5rem, 18rem); - grid-template-areas: none; - align-items: start; - gap: 1.5rem 2.4rem; + .hero-copy h1 { + font-size: 4.2rem; } - .site-head__utility { - justify-items: end; - padding: 0 0 0 1.2rem; - border-top: 0; - border-left: 1px solid var(--border); + .hero-copy p { + font-size: 1rem; } - .site-head__theme, - .site-head__status, - .site-head__actions { - justify-content: flex-end; + .hero-console { + padding: 0.65rem; } - .appcast-download__body { - align-items: flex-end; + .hero-bottom { + padding: 0 0.9rem 0.9rem; } - .appcast-download__kicker, - .appcast-download__title-row { - justify-content: flex-end; + .site-section { + padding: 3rem 0.9rem 0; } - .appcast-download__meta { - text-align: right; + .section-heading h2 { + font-size: 2.2rem; } - .release-delta__content-grid { - grid-template-columns: minmax(0, 1fr) minmax(14rem, 16rem); - gap: 2rem; + .lead-brief { + padding: 1rem; } - .release-overview-card__details { - grid-template-columns: repeat(2, minmax(0, 1fr)); + .lead-brief h3 { + font-size: 2.1rem; } - .release-delta__state { - padding: 0 0 0 1.1rem; - border-top: 0; - border-left: 1px solid var(--border); + .publisher-flow { + border-top: 1px solid var(--border); } - .release-delta__criteria-list { + .signal-source-list li { grid-template-columns: minmax(0, 1fr); - } - - .feed-toolbar { - grid-template-columns: minmax(0, 1fr) auto; - align-items: start; - } - - .signal-entry-action__row, - .signal-entry-action__effect { - grid-template-columns: minmax(8rem, 9rem) minmax(0, 1fr); + gap: 0.2rem; } } From 6bb2a8e69b1346be926f32e8c0aff9f020353d01 Mon Sep 17 00:00:00 2001 From: Yvette Carlisle Date: Wed, 13 May 2026 22:23:42 +0800 Subject: [PATCH 10/12] {"schema":"decodex/commit/1","summary":"Fix site Three scene loading","authority":"manual"} --- site/src/components/SignalSymphony.astro | 15 +++------------ 1 file changed, 3 insertions(+), 12 deletions(-) diff --git a/site/src/components/SignalSymphony.astro b/site/src/components/SignalSymphony.astro index 26b336a3..3c850886 100644 --- a/site/src/components/SignalSymphony.astro +++ b/site/src/components/SignalSymphony.astro @@ -18,6 +18,7 @@ const { totalSignals, tryPathCount, highImpactCount } = Astro.props; >
diff --git a/site/src/components/SignalSymphony.astro b/site/src/components/SignalSymphony.astro index 3c850886..e46da215 100644 --- a/site/src/components/SignalSymphony.astro +++ b/site/src/components/SignalSymphony.astro @@ -84,7 +84,7 @@ const { totalSignals, tryPathCount, highImpactCount } = Astro.props; const pipelineMaterial = new THREE.LineBasicMaterial({ color: 0x8ab4ff, transparent: true, - opacity: 0.4, + opacity: 0.68, }); const pipeline = new THREE.Line(pipelineGeometry, pipelineMaterial); constellation.add(pipeline); @@ -104,7 +104,7 @@ const { totalSignals, tryPathCount, highImpactCount } = Astro.props; color: nodeColors[index], wireframe: true, transparent: true, - opacity: index === 2 ? 0.72 : 0.78, + opacity: index === 2 ? 0.86 : 0.9, }); const mesh = new THREE.Mesh(nodeGeometry, material); mesh.position.copy(position); @@ -117,7 +117,7 @@ const { totalSignals, tryPathCount, highImpactCount } = Astro.props; const ringMaterial = new THREE.MeshBasicMaterial({ color: 0xb6f13a, transparent: true, - opacity: 0.48, + opacity: 0.68, }); const ring = new THREE.Mesh(ringGeometry, ringMaterial); ring.position.set(0.45, 0.05, -0.4); @@ -129,7 +129,7 @@ const { totalSignals, tryPathCount, highImpactCount } = Astro.props; const secondaryRingMaterial = new THREE.MeshBasicMaterial({ color: 0xff5db7, transparent: true, - opacity: 0.22, + opacity: 0.36, }); const secondaryRing = new THREE.Mesh(secondaryRingGeometry, secondaryRingMaterial); secondaryRing.position.set(0.45, 0.05, -0.7); @@ -138,7 +138,7 @@ const { totalSignals, tryPathCount, highImpactCount } = Astro.props; pulse.add(secondaryRing); disposables.push(secondaryRingGeometry, secondaryRingMaterial); - const particleCount = 260; + const particleCount = 360; const positions = new Float32Array(particleCount * 3); const colors = new Float32Array(particleCount * 3); const colorA = new THREE.Color(0xb6f13a); @@ -161,10 +161,10 @@ const { totalSignals, tryPathCount, highImpactCount } = Astro.props; particleGeometry.setAttribute("position", new THREE.BufferAttribute(positions, 3)); particleGeometry.setAttribute("color", new THREE.BufferAttribute(colors, 3)); const particleMaterial = new THREE.PointsMaterial({ - size: 0.04, + size: 0.052, vertexColors: true, transparent: true, - opacity: 0.82, + opacity: 0.94, depthWrite: false, }); const particles = new THREE.Points(particleGeometry, particleMaterial); diff --git a/site/src/content.config.ts b/site/src/content.config.ts index a236591f..e43c8b7f 100644 --- a/site/src/content.config.ts +++ b/site/src/content.config.ts @@ -159,6 +159,29 @@ const releaseDeltaSchema = z }); }); +const resetStatusEvidencePostSchema = z.object({ + published_at_label: z.string().min(1).optional(), + relevance: z.enum(["related", "not_related", "uncertain"]), + summary: z.string().min(1), + url: z.string().regex(/^https:\/\//, "post url must be an https URL").optional(), +}); + +const resetStatusSchema = z.object({ + schema: z.literal("reset_status/v1"), + question: z.string().min(1), + answer: z.enum(["yes", "no", "unknown"]), + confidence: z.enum(["confirmed", "likely", "weak"]), + observed_for_date: z.string().regex(/^\d{4}-\d{2}-\d{2}$/, "observed_for_date must be YYYY-MM-DD"), + timezone: z.string().min(1), + generated_at: z.string().min(1), + source_account: z.string().min(1), + source_url: z.string().regex(/^https:\/\//, "source_url must be an https URL"), + search_url: z.string().regex(/^https:\/\//, "search_url must be an https URL").optional(), + judgment_mode: z.literal("ai_semantic_review"), + rationale: z.string().min(1), + evidence_posts: z.array(resetStatusEvidencePostSchema).default([]), +}); + const signals = defineCollection({ loader: glob({ pattern: "**/*.json", @@ -175,7 +198,16 @@ const releaseDeltas = defineCollection({ schema: releaseDeltaSchema, }); +const resetStatus = defineCollection({ + loader: glob({ + pattern: "**/*.json", + base: "./src/content/reset-status", + }), + schema: resetStatusSchema, +}); + export const collections = { signals, releaseDeltas, + resetStatus, }; diff --git a/site/src/content/reset-status/latest.json b/site/src/content/reset-status/latest.json new file mode 100644 index 00000000..da767025 --- /dev/null +++ b/site/src/content/reset-status/latest.json @@ -0,0 +1,31 @@ +{ + "schema": "reset_status/v1", + "question": "Are we reset today?", + "answer": "no", + "confidence": "likely", + "observed_for_date": "2026-05-13", + "timezone": "Asia/Shanghai", + "generated_at": "2026-05-13T15:27:51Z", + "source_account": "@thsottiaux", + "source_url": "https://x.com/thsottiaux", + "search_url": "https://x.com/search?q=from%3Athsottiaux%20since%3A2026-05-13%20until%3A2026-05-14&src=typed_query&f=live", + "judgment_mode": "ai_semantic_review", + "rationale": "AI semantic review of today's visible @thsottiaux posts did not find a post about rate limit quota reset, cap recovery, or reset timing.", + "evidence_posts": [ + { + "published_at_label": "9h", + "relevance": "not_related", + "summary": "Post about using ChatGPT more after GPT-5.5 Instant." + }, + { + "published_at_label": "12h", + "relevance": "not_related", + "summary": "Post about in-app browser improvements in the Codex app." + }, + { + "published_at_label": "13h", + "relevance": "not_related", + "summary": "Short reply to another X user without rate-limit reset content." + } + ] +} diff --git a/site/src/lib/reset-status.ts b/site/src/lib/reset-status.ts index ab72fb6a..4c4331cb 100644 --- a/site/src/lib/reset-status.ts +++ b/site/src/lib/reset-status.ts @@ -1,5 +1,51 @@ export const RESET_STATUS_QUESTION = "Are we reset today?"; -export const RESET_STATUS_INCIDENT_ID = "01KK9JA8JKQKDW1W24T09NHBYH"; -export const RESET_STATUS_SOURCE_URL = `https://status.openai.com/incidents/${RESET_STATUS_INCIDENT_ID}`; -export const RESET_STATUS_API_URL = "https://status.openai.com/api/v2/incidents.json"; -export const RESET_STATUS_WINDOW_MS = 24 * 60 * 60 * 1000; +export const RESET_STATUS_SOURCE_ACCOUNT = "@thsottiaux"; +export const RESET_STATUS_SOURCE_URL = "https://x.com/thsottiaux"; + +export type ResetStatusAnswer = "yes" | "no" | "unknown"; +export type ResetStatusConfidence = "confirmed" | "likely" | "weak"; + +export type ResetStatusEvidencePost = { + published_at_label?: string; + relevance: "related" | "not_related" | "uncertain"; + summary: string; + url?: string; +}; + +export type ResetStatusData = { + answer: ResetStatusAnswer; + confidence: ResetStatusConfidence; + evidence_posts: ResetStatusEvidencePost[]; + generated_at: string; + judgment_mode: "ai_semantic_review"; + observed_for_date: string; + question: string; + rationale: string; + schema: "reset_status/v1"; + search_url?: string; + source_account: string; + source_url: string; + timezone: string; +}; + +export function resetStatusAnswerLabel(answer: ResetStatusAnswer): string { + switch (answer) { + case "yes": + return "Yes"; + case "no": + return "No"; + case "unknown": + return "Unknown"; + } +} + +export function resetStatusTone(answer: ResetStatusAnswer): "muted" | "neutral" | "positive" { + switch (answer) { + case "yes": + return "positive"; + case "no": + return "neutral"; + case "unknown": + return "muted"; + } +} diff --git a/site/src/pages/index.astro b/site/src/pages/index.astro index 40a0f1b6..58aa7f03 100644 --- a/site/src/pages/index.astro +++ b/site/src/pages/index.astro @@ -14,6 +14,7 @@ import { type ReleaseDeltaData, } from "@/lib/release-delta"; import { renderMarkdownInline } from "@/lib/render-markdown"; +import { type ResetStatusData } from "@/lib/reset-status"; import { FILTERS, formatPublishedAt, @@ -29,8 +30,12 @@ import { const rawFilter = Astro.url.searchParams.get("filter"); const activeFilter: FilterId = isFilterId(rawFilter) ? rawFilter : "all"; +const decodexGitHubUrl = "https://github.com/hack-ink/decodex"; +const primaryXUrl = "https://x.com/YvetteCipher"; +const signalBotXUrl = "https://x.com/decodexspace"; const collectionEntries = await getCollection("signals"); const releaseDeltaEntries = await getCollection("releaseDeltas"); +const resetStatusEntries = await getCollection("resetStatus"); const allSignals: SignalCardData[] = sortSignals( collectionEntries.map((entry) => ({ id: entry.id, @@ -42,6 +47,10 @@ const releaseDelta: ReleaseDeltaData | null = releaseDeltaEntries .map((entry) => entry.data as ReleaseDeltaData) .find((entry) => entry.repo === "openai/codex") ?? null; +const resetStatus: ResetStatusData | null = + resetStatusEntries + .map((entry) => entry.data as ResetStatusData) + .sort((left, right) => right.generated_at.localeCompare(left.generated_at))[0] ?? null; const previewSignal: SignalCardData = { id: "preview-shell", @@ -144,20 +153,20 @@ const releaseWindow = const productLoops = [ { - title: "Watch every upstream move", - body: "Track Codex commits, PRs, prereleases, and release checkpoints without waiting for official notes.", + title: "Control Plane", + body: "Project registry, identity routing, signing policy, review handoff, and landing rules.", }, { - title: "Read code as evidence", - body: "Bundle PR bodies, touched files, tests, caveats, and migration signals into source-backed entries.", + title: "Retained execution", + body: "Issue intake, context preservation, progress checkpoints, and verified handoff.", }, { - title: "Route impact into Decodex", - body: "Mark what affects Control Plane, app-server integration, plugins, automation, and operator workflows.", + title: "Upstream radar", + body: "Commit and PR analysis translated into product follow-up.", }, { - title: "Publish useful community output", - body: "Turn confirmed changes into X posts, release rollups, and practical try paths for Codex users.", + title: "Publisher", + body: "X posts, release rollups, and migration notes with source links intact.", }, ]; @@ -273,11 +282,220 @@ const filterRuntimeScript = `(function () { applyFilter(readFilter(), { updateHistory: false, animate: false }); }); })();`; + +const interactionRuntimeScript = `(function () { + var reduceMotion = window.matchMedia("(prefers-reduced-motion: reduce)"); + var revealSelector = [ + ".utility-strip", + ".site-section", + ".system-loop li", + ".lead-brief", + ".brief-list", + ".watch-list", + ".publisher-note", + ".publisher-flow span", + ".signal-card", + ".hero-bottom div" + ].join(","); + var pressSelector = [ + ".hero-actions a", + ".lead-brief__link", + ".filter-chip", + ".appcast-download__primary", + ".appcast-download__version", + ".system-panel__links a", + ".brief-list a", + ".utility-row--window a", + ".signal-card__index a", + ".signal-source-list a" + ].join(","); + var revealObserver = null; + var navObserver = null; + var revealGeometryBound = false; + var revealFrame = 0; + + function all(selector) { + return Array.prototype.slice.call(document.querySelectorAll(selector)); + } + + function revealByGeometry() { + revealFrame = 0; + all(".reveal-ready:not(.is-visible)").forEach(function (node) { + if (!(node instanceof HTMLElement) || node.hidden) return; + var rect = node.getBoundingClientRect(); + if (rect.top < window.innerHeight * 0.96 && rect.bottom > window.innerHeight * -0.1) { + node.classList.add("is-visible"); + } + }); + } + + function revealAllReady() { + all(".reveal-ready:not(.is-visible)").forEach(function (node) { + if (node instanceof HTMLElement && !node.hidden) node.classList.add("is-visible"); + }); + } + + function scheduleGeometryReveal() { + if (revealFrame) return; + revealFrame = window.requestAnimationFrame(revealByGeometry); + } + + function bindGeometryReveal() { + if (revealGeometryBound || reduceMotion.matches) return; + revealGeometryBound = true; + window.addEventListener("scroll", scheduleGeometryReveal, { passive: true }); + window.addEventListener("resize", scheduleGeometryReveal); + } + + function bindReveals() { + var nodes = all(revealSelector).filter(function (node) { + return node instanceof HTMLElement && node.dataset.revealBound !== "true"; + }); + if (nodes.length === 0) return; + + nodes.forEach(function (node, index) { + node.dataset.revealBound = "true"; + node.style.setProperty("--reveal-delay", String(Math.min(index % 7, 6) * 36) + "ms"); + node.classList.add("reveal-ready"); + }); + + if (reduceMotion.matches || !("IntersectionObserver" in window)) { + nodes.forEach(function (node) { + node.classList.add("is-visible"); + }); + return; + } + + if (!revealObserver) { + revealObserver = new IntersectionObserver(function (entries) { + entries.forEach(function (entry) { + if (!entry.isIntersecting) return; + entry.target.classList.add("is-visible"); + revealObserver.unobserve(entry.target); + }); + }, { rootMargin: "0px 0px -8% 0px", threshold: 0.12 }); + } + + nodes.forEach(function (node) { + revealObserver.observe(node); + }); + bindGeometryReveal(); + scheduleGeometryReveal(); + window.setTimeout(scheduleGeometryReveal, 360); + window.setTimeout(revealAllReady, 520); + } + + function syncNav(id) { + all(".site-nav a[href^='#']").forEach(function (link) { + var active = link.hash === "#" + id; + link.dataset.current = active ? "true" : "false"; + if (active) link.setAttribute("aria-current", "location"); + else if (link.getAttribute("aria-current") === "location") link.removeAttribute("aria-current"); + }); + } + + function bindNav() { + var links = all(".site-nav a[href^='#']"); + if (links.length === 0 || navObserver || !("IntersectionObserver" in window)) return; + var sections = links + .map(function (link) { + return document.getElementById(link.hash.slice(1)); + }) + .filter(function (section) { + return section instanceof HTMLElement; + }); + if (sections.length === 0) return; + + navObserver = new IntersectionObserver(function (entries) { + var visible = entries + .filter(function (entry) { return entry.isIntersecting; }) + .sort(function (left, right) { return right.intersectionRatio - left.intersectionRatio; })[0]; + if (visible && visible.target.id) syncNav(visible.target.id); + }, { rootMargin: "-22% 0px -55% 0px", threshold: [0.18, 0.35, 0.58] }); + + sections.forEach(function (section) { + navObserver.observe(section); + }); + if (window.location.hash) syncNav(window.location.hash.slice(1)); + } + + function bindDetails() { + all(".signal-card__evidence").forEach(function (details) { + if (!(details instanceof HTMLDetailsElement) || details.dataset.evidenceBound === "true") return; + details.dataset.evidenceBound = "true"; + details.addEventListener("toggle", function () { + var card = details.closest("[data-signal-card]"); + if (card instanceof HTMLElement) { + card.dataset.evidenceOpen = details.open ? "true" : "false"; + } + }); + }); + } + + function bindPressStates() { + all(pressSelector).forEach(function (target) { + if (!(target instanceof HTMLElement) || target.dataset.pressBound === "true") return; + target.dataset.pressBound = "true"; + var clear = function () { + target.dataset.pressed = "false"; + }; + target.addEventListener("pointerdown", function () { + target.dataset.pressed = "true"; + }); + target.addEventListener("pointerup", clear); + target.addEventListener("pointercancel", clear); + target.addEventListener("pointerleave", clear); + target.addEventListener("blur", clear); + target.addEventListener("keydown", function (event) { + if (event.key === "Enter" || event.key === " ") target.dataset.pressed = "true"; + }); + target.addEventListener("keyup", clear); + }); + } + + function bindHeroPointer() { + var hero = document.querySelector(".official-hero"); + if (!(hero instanceof HTMLElement) || hero.dataset.pointerBound === "true" || reduceMotion.matches) return; + hero.dataset.pointerBound = "true"; + var frame = 0; + var nextX = 0; + var nextY = 0; + function applyShift() { + hero.style.setProperty("--hero-shift-x", nextX.toFixed(2) + "px"); + hero.style.setProperty("--hero-shift-y", nextY.toFixed(2) + "px"); + frame = 0; + } + hero.addEventListener("pointermove", function (event) { + var rect = hero.getBoundingClientRect(); + if (rect.width === 0 || rect.height === 0) return; + nextX = ((event.clientX - rect.left) / rect.width - 0.5) * -12; + nextY = ((event.clientY - rect.top) / rect.height - 0.5) * -10; + if (!frame) frame = window.requestAnimationFrame(applyShift); + }); + hero.addEventListener("pointerleave", function () { + nextX = 0; + nextY = 0; + if (!frame) frame = window.requestAnimationFrame(applyShift); + }); + } + + function bindInteractions() { + bindReveals(); + bindNav(); + bindDetails(); + bindPressStates(); + bindHeroPointer(); + } + + document.addEventListener("astro:page-load", bindInteractions); + document.addEventListener("DOMContentLoaded", bindInteractions); + bindInteractions(); +})();`; ---
@@ -298,7 +516,7 @@ const filterRuntimeScript = `(function () { />
+
+
+
+ Live status +

Beta downloads, reset watch, and the current tracked release window.

+
+
+
+ Codex app feed + +
+
+ Reset watch + +
+ {releaseWindow ? ( +
+ Upstream window + + {releaseWindow.stable} -> {releaseWindow.preview} + {releaseWindow.commits} commits under watch + +
+ ) : null} +
+
+
+
-

What Decodex automates

+

Automation map

- The website is the public readout of a continuous Decodex loop, not a static changelog. + Four loops behind the product surface.

-
- {productLoops.map((item, index) => ( -
- {String(index + 1).padStart(2, "0")} -

{item.title}

-

{item.body}

-
- ))} +
+
+ Decodex software + Operate work, track impact, and keep delivery policy explicit. +
+ GitHub + @YvetteCipher + @decodexspace bot +
+
+
    + {productLoops.map((item, index) => ( +
  1. + {String(index + 1).padStart(2, "0")} +
    +

    {item.title}

    +

    {item.body}

    +
    +
    2. + ))} +
-

Live Codex radar

+

Decodex radar

- High-signal upstream changes become reader-facing action, watch state, and Control Plane context. + Prioritized changes with an action path or watch note attached.

@@ -450,14 +690,14 @@ const filterRuntimeScript = `(function () {

Publisher output

- Decodex turns the same evidence base into public posts, prerelease briefs, and release rollups. + Public updates from the analyzed source set.

Draft logic

- Every post starts from commit and PR evidence, then separates what changed, who should try it, and what Decodex should absorb into B-side workflows. + Drafts separate the change, the audience, and any B-side follow-up. Bot: @decodexspace.

@@ -474,7 +714,7 @@ const filterRuntimeScript = `(function () {

Evidence feed

- Every entry stays source-backed. Use filters when you only need runnable changes or high-impact shifts. + Source-backed cards. Filter for try paths or high-impact shifts.

@@ -496,4 +736,5 @@ const filterRuntimeScript = `(function () {
{hasPublishedSignals ? : null} + diff --git a/site/src/styles/global.css b/site/src/styles/global.css index 79b34eaf..b339303a 100644 --- a/site/src/styles/global.css +++ b/site/src/styles/global.css @@ -25,11 +25,35 @@ --success-border: #c8dfbc; --code-bg: #e8edf4; --code-border: #c9d2df; - --stage-bg: #0c1118; - --stage-ink: #f5f7ff; - --stage-soft: #b9c2d4; - --stage-muted: #778397; - --stage-border: rgba(255, 255, 255, 0.14); + --stage-bg: #f5f8ff; + --stage-ink: #07111e; + --stage-soft: #33445d; + --stage-muted: #6f7b8f; + --stage-border: rgba(12, 22, 38, 0.14); + --stage-control-bg: rgba(255, 255, 255, 0.58); + --stage-control-border: rgba(12, 22, 38, 0.14); + --stage-control-hover: rgba(12, 22, 38, 0.06); + --stage-glass-bg: rgba(255, 255, 255, 0.48); + --stage-glass-bg-hover: rgba(255, 255, 255, 0.64); + --stage-selected-bg: #0d1726; + --stage-selected-ink: #f7fbff; + --appcast-menu-bg: rgba(255, 255, 255, 0.98); + --appcast-menu-ink: var(--ink); + --appcast-menu-muted: var(--muted); + --appcast-menu-border: rgba(12, 22, 38, 0.14); + --appcast-menu-hover: rgba(37, 99, 235, 0.08); + --appcast-menu-accent: var(--accent-strong); + --appcast-menu-shadow: 0 22px 60px rgba(20, 32, 52, 0.16); + --hero-background: + radial-gradient(circle at 72% 36%, rgba(37, 99, 235, 0.22), transparent 24rem), + radial-gradient(circle at 82% 12%, rgba(182, 241, 58, 0.16), transparent 18rem), + linear-gradient(135deg, #f9fbff, #e8f0ff 58%, #f3fbf5); + --hero-veil: + linear-gradient(90deg, rgba(248, 251, 255, 0.88) 0%, rgba(248, 251, 255, 0.58) 42%, rgba(248, 251, 255, 0.06) 78%), + linear-gradient(180deg, rgba(248, 251, 255, 0.02), rgba(232, 240, 255, 0.24)); + --hero-grid-line: rgba(12, 22, 38, 0.065); + --hero-scene-filter: saturate(1.16) contrast(1.08) drop-shadow(0 0 22px rgba(37, 99, 235, 0.18)); + --hero-scene-opacity: 1; } @media (prefers-color-scheme: dark) { @@ -60,6 +84,29 @@ --stage-soft: #b9c2d4; --stage-muted: #778397; --stage-border: rgba(255, 255, 255, 0.14); + --stage-control-bg: rgba(15, 22, 32, 0.72); + --stage-control-border: rgba(255, 255, 255, 0.14); + --stage-control-hover: rgba(255, 255, 255, 0.08); + --stage-glass-bg: rgba(10, 15, 23, 0.38); + --stage-glass-bg-hover: rgba(10, 15, 23, 0.54); + --stage-selected-bg: #f5f7ff; + --stage-selected-ink: #111720; + --appcast-menu-bg: rgba(11, 17, 26, 0.98); + --appcast-menu-ink: #f5f7ff; + --appcast-menu-muted: #778397; + --appcast-menu-border: rgba(255, 255, 255, 0.14); + --appcast-menu-hover: rgba(255, 255, 255, 0.08); + --appcast-menu-accent: var(--signal); + --appcast-menu-shadow: 0 22px 60px rgba(0, 0, 0, 0.38); + --hero-background: + radial-gradient(circle at 68% 38%, rgba(138, 180, 255, 0.2), transparent 24rem), + linear-gradient(135deg, #0a0f16, #111923 58%, #071018); + --hero-veil: + linear-gradient(90deg, rgba(10, 15, 22, 0.72) 0%, rgba(10, 15, 22, 0.42) 44%, rgba(10, 15, 22, 0.08) 78%), + linear-gradient(180deg, rgba(10, 15, 22, 0.02), rgba(10, 15, 22, 0.42)); + --hero-grid-line: rgba(255, 255, 255, 0.035); + --hero-scene-filter: saturate(1.12) contrast(1.08) drop-shadow(0 0 20px rgba(182, 241, 58, 0.12)); + --hero-scene-opacity: 1; } } @@ -89,6 +136,29 @@ --stage-soft: #b9c2d4; --stage-muted: #778397; --stage-border: rgba(255, 255, 255, 0.14); + --stage-control-bg: rgba(15, 22, 32, 0.72); + --stage-control-border: rgba(255, 255, 255, 0.14); + --stage-control-hover: rgba(255, 255, 255, 0.08); + --stage-glass-bg: rgba(10, 15, 23, 0.38); + --stage-glass-bg-hover: rgba(10, 15, 23, 0.54); + --stage-selected-bg: #f5f7ff; + --stage-selected-ink: #111720; + --appcast-menu-bg: rgba(11, 17, 26, 0.98); + --appcast-menu-ink: #f5f7ff; + --appcast-menu-muted: #778397; + --appcast-menu-border: rgba(255, 255, 255, 0.14); + --appcast-menu-hover: rgba(255, 255, 255, 0.08); + --appcast-menu-accent: var(--signal); + --appcast-menu-shadow: 0 22px 60px rgba(0, 0, 0, 0.38); + --hero-background: + radial-gradient(circle at 68% 38%, rgba(138, 180, 255, 0.2), transparent 24rem), + linear-gradient(135deg, #0a0f16, #111923 58%, #071018); + --hero-veil: + linear-gradient(90deg, rgba(10, 15, 22, 0.72) 0%, rgba(10, 15, 22, 0.42) 44%, rgba(10, 15, 22, 0.08) 78%), + linear-gradient(180deg, rgba(10, 15, 22, 0.02), rgba(10, 15, 22, 0.42)); + --hero-grid-line: rgba(255, 255, 255, 0.035); + --hero-scene-filter: saturate(1.12) contrast(1.08) drop-shadow(0 0 20px rgba(182, 241, 58, 0.12)); + --hero-scene-opacity: 1; } * { @@ -99,6 +169,7 @@ html { min-height: 100%; background: var(--bg); scroll-behavior: smooth; + scroll-padding-top: 1.25rem; } body { @@ -134,6 +205,23 @@ a { text-decoration: none; } +a, +button, +summary { + transition: + background-color 180ms ease, + border-color 180ms ease, + box-shadow 180ms ease, + color 180ms ease, + opacity 180ms ease, + transform 180ms ease; +} + +:focus-visible { + outline: 2px solid color-mix(in srgb, var(--accent) 72%, transparent); + outline-offset: 0.2rem; +} + button, input, select, @@ -161,13 +249,13 @@ code { .official-hero { position: relative; + --hero-shift-x: 0px; + --hero-shift-y: 0px; display: grid; grid-template-rows: auto minmax(0, 1fr) auto; min-height: min(45rem, 100vh); overflow: hidden; - background: - radial-gradient(circle at 68% 38%, rgba(138, 180, 255, 0.18), transparent 24rem), - linear-gradient(135deg, #0a0f16, #111923 58%, #071018); + background: var(--hero-background); color: var(--stage-ink); } @@ -175,10 +263,8 @@ code { content: ""; position: absolute; inset: 0; - z-index: 1; - background: - linear-gradient(90deg, rgba(10, 15, 22, 0.92) 0%, rgba(10, 15, 22, 0.68) 44%, rgba(10, 15, 22, 0.18) 78%), - linear-gradient(180deg, rgba(10, 15, 22, 0.06), rgba(10, 15, 22, 0.64)); + z-index: 0; + background: var(--hero-veil); pointer-events: none; } @@ -188,17 +274,21 @@ code { inset: 0; z-index: 1; background: - linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px), - linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px); + linear-gradient(var(--hero-grid-line) 1px, transparent 1px), + linear-gradient(90deg, var(--hero-grid-line) 1px, transparent 1px); background-size: 2.4rem 2.4rem; mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.68), transparent 78%); pointer-events: none; + transform: translate3d(var(--hero-shift-x), var(--hero-shift-y), 0); + transition: transform 220ms ease-out; } .symphony-scene { position: absolute; inset: 0; - z-index: 0; + z-index: 1; + filter: var(--hero-scene-filter); + opacity: var(--hero-scene-opacity); } .symphony-scene canvas { @@ -229,6 +319,15 @@ code { display: block; width: auto; height: 2.35rem; + transition: + filter 180ms ease, + transform 180ms ease; +} + +.site-logo:hover .site-logo__image, +.site-logo:focus-visible .site-logo__image { + filter: drop-shadow(0 0 14px rgba(182, 241, 58, 0.2)); + transform: translateY(-0.05rem); } .site-nav { @@ -240,33 +339,65 @@ code { } .site-nav a { + position: relative; color: var(--stage-soft); font-size: 0.84rem; font-weight: 740; line-height: 1; + padding-block: 0.46rem; +} + +.site-nav a::after { + content: ""; + position: absolute; + right: 0; + bottom: 0.2rem; + left: 0; + height: 1px; + background: var(--signal); + opacity: 0; + transform: scaleX(0); + transform-origin: right; + transition: + opacity 180ms ease, + transform 180ms ease; } -.site-nav a:hover { +.site-nav a:hover, +.site-nav a:focus-visible, +.site-nav a[data-current="true"] { color: var(--stage-ink); } +.site-nav a:hover::after, +.site-nav a:focus-visible::after, +.site-nav a[data-current="true"]::after { + opacity: 1; + transform: scaleX(1); + transform-origin: left; +} + .theme-toggle { display: inline-flex; align-items: center; gap: 0.18rem; width: fit-content; padding: 0.18rem; - border: 1px solid rgba(255, 255, 255, 0.14); - border-radius: 999px; - background: rgba(15, 22, 32, 0.72); + border: 1px solid var(--stage-control-border); + border-radius: 0.42rem; + background: var(--stage-control-bg); backdrop-filter: blur(16px); + transition: + border-color 180ms ease, + background-color 180ms ease, + box-shadow 180ms ease; } .theme-toggle__button { min-height: 1.8rem; padding: 0.35rem 0.7rem; border: 0; - border-radius: 999px; + border-radius: 0.28rem; background: transparent; color: var(--stage-muted); cursor: pointer; @@ -276,12 +407,14 @@ code { } .theme-toggle__button:hover { + background: var(--stage-control-hover); color: var(--stage-ink); } .theme-toggle__button[aria-pressed="true"] { - background: var(--stage-ink); - color: #111720; + background: var(--stage-selected-bg); + box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.08); + color: var(--stage-selected-ink); } .hero-grid { @@ -325,62 +458,49 @@ code { .hero-actions a, .lead-brief__link { + position: relative; display: inline-flex; align-items: center; justify-content: center; - min-height: 2.28rem; - padding: 0.55rem 0.88rem; - border: 1px solid rgba(255, 255, 255, 0.22); - border-radius: 999px; + min-height: 2.18rem; + padding: 0.52rem 0.72rem; + border: 1px solid var(--stage-control-border); + border-radius: 0.28rem; color: var(--stage-ink); font-size: 0.84rem; font-weight: 780; line-height: 1; - backdrop-filter: blur(16px); + backdrop-filter: none; + will-change: transform; } -.hero-actions a:first-child, -.lead-brief__link { +.hero-actions a:first-child { border-color: color-mix(in srgb, var(--signal) 84%, transparent); - background: var(--signal); - color: var(--signal-ink); + background: color-mix(in srgb, var(--signal) 12%, transparent); + color: var(--stage-ink); } .hero-actions a:hover, -.lead-brief__link:hover { +.hero-actions a:focus-visible, +.lead-brief__link:hover, +.lead-brief__link:focus-visible { border-color: var(--signal); color: var(--signal); + transform: translateY(-0.08rem); } .hero-actions a:first-child:hover, -.lead-brief__link:hover { - color: var(--signal-ink); -} - -.hero-console { - display: grid; - gap: 0.65rem; - min-width: 0; - padding: 0.8rem; - border: 1px solid var(--stage-border); - border-radius: 1rem; - background: rgba(10, 15, 23, 0.58); - backdrop-filter: blur(20px); +.hero-actions a:first-child:focus-visible, +.lead-brief__link:hover, +.lead-brief__link:focus-visible { + color: var(--signal); } -.console-row, -.console-window { - display: grid; - gap: 0.38rem; - min-width: 0; - padding: 0.7rem 0.72rem; - border: 1px solid var(--stage-border); - border-radius: 0.72rem; - background: rgba(255, 255, 255, 0.045); +.hero-actions a[data-pressed="true"], +.lead-brief__link[data-pressed="true"] { + transform: translateY(0) scale(0.985); } -.console-row > span, -.console-window > span, .hero-bottom span, .system-loop span, .publisher-note span, @@ -399,29 +519,10 @@ code { text-transform: uppercase; } -.official-hero .console-row > span, -.official-hero .console-window > span, .official-hero .hero-bottom span { color: var(--stage-muted); } -.console-window strong { - color: var(--stage-ink); - font-size: 1rem; - font-weight: 800; - line-height: 1.1; -} - -.console-window a { - color: var(--stage-soft); - font-size: 0.82rem; - line-height: 1.28; -} - -.console-window a:hover { - color: var(--signal); -} - .hero-bottom { position: relative; z-index: 2; @@ -439,8 +540,18 @@ code { padding: 0.78rem 0.65rem; border-top: 1px solid var(--stage-border); border-right: 1px solid var(--stage-border); - background: rgba(10, 15, 23, 0.38); + background: var(--stage-glass-bg); backdrop-filter: blur(16px); + transition: + background-color 180ms ease, + border-color 180ms ease, + transform 180ms ease; +} + +.hero-bottom div:hover { + border-top-color: color-mix(in srgb, var(--signal) 34%, var(--stage-border)); + background: var(--stage-glass-bg-hover); + transform: translateY(-0.08rem); } .hero-bottom div:nth-child(2n), @@ -457,23 +568,37 @@ code { .appcast-download { position: relative; - display: flex; + display: block; + width: 100%; min-width: 0; } .appcast-download__surface { position: relative; - display: flex; + display: grid; + gap: 0; + width: 100%; min-width: 0; } .appcast-download__primary { - display: inline-flex; + display: flex; + align-items: start; + justify-content: space-between; + width: 100%; min-width: 0; padding: 0; border: 0; background: transparent; color: inherit; + text-align: left; + will-change: transform; +} + +.appcast-download__primary:focus-visible { + border-radius: 0.38rem; + outline: 1.5px solid color-mix(in srgb, var(--signal) 75%, transparent); + outline-offset: 0.18rem; } .appcast-download__body { @@ -490,7 +615,7 @@ code { .appcast-download__eyebrow { color: var(--signal); - font-size: 0.7rem; + font-size: 0.64rem; font-weight: 780; line-height: 1; text-transform: uppercase; @@ -498,55 +623,79 @@ code { .appcast-download__title { color: var(--stage-ink); - font-size: 0.96rem; + font-size: 0.88rem; font-weight: 780; line-height: 1.15; } .appcast-download__meta { color: var(--stage-soft); - font-size: 0.8rem; + font-size: 0.74rem; line-height: 1.25; } .appcast-download__primary:hover .appcast-download__title, .appcast-download[data-appcast-open="true"] .appcast-download__title, +.appcast-download:hover .appcast-download__title, +.appcast-download:focus-within .appcast-download__title, .appcast-download__primary:focus-visible .appcast-download__title { color: var(--signal); } +.appcast-download__primary[data-pressed="true"] { + transform: translateY(0.04rem); +} + .appcast-download__panel { position: absolute; - top: calc(100% + 0.65rem); - left: 0; - z-index: 20; + right: 0; + top: calc(100% + 0.54rem); + bottom: auto; + z-index: 30; display: grid; - gap: 0.38rem; - width: max-content; - min-width: min(18rem, calc(100vw - 2rem)); - max-width: calc(100vw - 2rem); - padding: 0.65rem; - border: 1px solid var(--stage-border); - border-radius: 0.7rem; - background: #121924; - box-shadow: 0 24px 70px rgba(0, 0, 0, 0.35); - color: var(--stage-ink); + gap: 0.42rem; + width: min(17.5rem, calc(100vw - 2rem)); + min-width: min(15rem, calc(100vw - 2rem)); + max-height: none; + padding: 0.62rem; + border: 1px solid var(--appcast-menu-border); + border-radius: 0.65rem; + background: var(--appcast-menu-bg); + box-shadow: var(--appcast-menu-shadow); + color: var(--appcast-menu-ink); + clip-path: inset(0 0 7% 0 round 0.65rem); + filter: blur(2px) saturate(0.92); opacity: 0; + overflow: visible; pointer-events: none; - transform: translateY(-0.25rem); + transform: translateY(-0.22rem) scale(0.985); + transform-origin: top right; transition: + clip-path 220ms cubic-bezier(0.2, 0.8, 0.2, 1), + filter 220ms ease, opacity 160ms ease, - transform 160ms ease; + transform 220ms cubic-bezier(0.2, 0.8, 0.2, 1); } .appcast-download[data-appcast-open="true"] .appcast-download__panel { + clip-path: inset(0 0 0 0 round 0.65rem); + filter: blur(0) saturate(1); + opacity: 1; + pointer-events: auto; + transform: translateY(0) scale(1); +} + +.appcast-download:hover .appcast-download__panel, +.appcast-download:focus-within .appcast-download__panel { + clip-path: inset(0 0 0 0 round 0.65rem); + filter: blur(0) saturate(1); opacity: 1; pointer-events: auto; - transform: translateY(0); + transform: translateY(0) scale(1); } .appcast-download__panel-label { - color: var(--stage-muted); + color: var(--appcast-menu-muted); font-size: 0.72rem; font-weight: 780; line-height: 1.2; @@ -556,32 +705,58 @@ code { .appcast-download__list { display: grid; gap: 0.12rem; + max-height: 11.8rem; margin: 0; - padding: 0; + padding: 0 0.18rem 0 0; + overflow-y: auto; list-style: none; + scrollbar-width: thin; +} + +.appcast-download__list::-webkit-scrollbar { + width: 0.36rem; +} + +.appcast-download__list::-webkit-scrollbar-track { + background: transparent; +} + +.appcast-download__list::-webkit-scrollbar-thumb { + border-radius: 999px; + background: color-mix(in srgb, var(--appcast-menu-muted) 36%, transparent); } .appcast-download__version { - display: grid; - gap: 0.05rem; - padding: 0.48rem 0.52rem; + display: flex; + align-items: baseline; + justify-content: space-between; + gap: 0.8rem; + min-width: 0; + padding: 0.4rem 0.45rem; border-radius: 0.45rem; + will-change: transform; } .appcast-download__version:hover, .appcast-download__version:focus-visible { - background: rgba(255, 255, 255, 0.08); - color: var(--signal); + background: var(--appcast-menu-hover); + color: var(--appcast-menu-accent); + transform: translateX(-0.1rem); +} + +.appcast-download__version[data-pressed="true"] { + transform: translateX(-0.04rem) scale(0.99); } .appcast-download__version-title { font-size: 0.9rem; font-weight: 780; + white-space: nowrap; } .appcast-download__version-meta, .appcast-download__empty { - color: var(--stage-muted); + color: var(--appcast-menu-muted); font-size: 0.78rem; } @@ -594,6 +769,14 @@ code { color: var(--stage-soft); font-size: 0.92rem; line-height: 1.25; + transition: + color 180ms ease, + transform 180ms ease; +} + +.reset-inline:hover, +.reset-inline:focus-visible { + transform: translateY(-0.04rem); } .reset-inline__question { @@ -601,6 +784,11 @@ code { font-weight: 760; } +.reset-inline:hover .reset-inline__question, +.reset-inline:focus-visible .reset-inline__question { + color: var(--accent-strong); +} + .reset-inline__answer { display: inline-flex; align-items: center; @@ -612,9 +800,18 @@ code { .reset-inline__dot { width: 0.48rem; height: 0.48rem; - border-radius: 999px; + border-radius: 50%; background: var(--stage-muted); box-shadow: 0 0 0 0.18rem rgba(119, 131, 151, 0.18); + transition: + background-color 180ms ease, + box-shadow 180ms ease, + transform 180ms ease; +} + +.reset-inline:hover .reset-inline__dot, +.reset-inline:focus-visible .reset-inline__dot { + transform: scale(1.12); } .reset-inline--positive .reset-inline__answer { @@ -627,18 +824,155 @@ code { } .reset-inline--neutral .reset-inline__answer { - color: var(--signal); + color: var(--stage-soft); } .reset-inline--neutral .reset-inline__dot { - background: var(--signal); - box-shadow: 0 0 0 0.18rem color-mix(in srgb, var(--signal) 22%, transparent); + background: var(--stage-muted); + box-shadow: 0 0 0 0.18rem rgba(119, 131, 151, 0.18); +} + +.utility-strip { + position: relative; + z-index: 4; + width: min(100%, 82rem); + margin: 0 auto; + padding: 1.2rem 1.15rem 0; + overflow: visible; +} + +.utility-strip__inner { + display: grid; + grid-template-columns: minmax(0, 1fr); + gap: 1rem; + padding: 1rem 0; + border-top: 1px solid var(--border-strong); + border-bottom: 1px solid var(--border-strong); +} + +.utility-strip__intro { + display: grid; + gap: 0.34rem; + min-width: 0; +} + +.utility-strip__intro span, +.utility-row > span { + color: var(--muted); + font-size: 0.72rem; + font-weight: 780; + line-height: 1.2; + text-transform: uppercase; +} + +.utility-strip__intro p { + max-width: 38rem; + color: var(--ink-soft); + font-size: 0.94rem; + line-height: 1.52; +} + +.utility-strip__items { + display: grid; + grid-template-columns: minmax(0, 1fr); + gap: 0; + min-width: 0; +} + +.utility-row { + position: relative; + display: grid; + grid-template-columns: minmax(7rem, 0.36fr) minmax(0, 1fr); + gap: 0.6rem 1rem; + align-items: baseline; + min-width: 0; + padding: 0.7rem 0; + border-top: 1px solid var(--border); + transition: + border-color 180ms ease, + transform 180ms ease; +} + +.utility-row::before { + content: ""; + position: absolute; + inset: 0 -0.62rem; + border-radius: 0.42rem; + background: color-mix(in srgb, var(--accent-soft) 44%, transparent); + opacity: 0; + pointer-events: none; + transform: scaleX(0.985); + transition: + opacity 180ms ease, + transform 180ms ease; +} + +.utility-row > * { + position: relative; +} + +.utility-row:hover, +.utility-row:focus-within { + border-top-color: var(--border-strong); +} + +.utility-row:hover::before, +.utility-row:focus-within::before { + opacity: 1; + transform: scaleX(1); +} + +.utility-row:first-child { + border-top: 0; + padding-top: 0; +} + +.utility-row:last-child { + padding-bottom: 0; +} + +.utility-row .appcast-download__eyebrow { + color: var(--accent-strong); +} + +.utility-row .appcast-download__title, +.utility-row .reset-inline__question, +.utility-row .reset-inline__answer, +.utility-row--window strong { + color: var(--ink); +} + +.utility-row .appcast-download__meta, +.utility-row small { + color: var(--ink-soft); +} + +.utility-row--window a { + display: grid; + gap: 0.24rem; + will-change: transform; +} + +.utility-row--window a:hover, +.utility-row--window a:focus-visible { + transform: translateY(-0.04rem); +} + +.utility-row--window a:hover strong, +.utility-row--window a:focus-visible strong { + color: var(--accent-strong); +} + +.utility-row--window small { + font-size: 0.82rem; + line-height: 1.3; } .site-section { width: min(100%, 82rem); margin: 0 auto; padding: 4rem 1.15rem 0; + scroll-margin-top: 1.25rem; } .section-heading { @@ -662,18 +996,138 @@ code { line-height: 1.58; } +.system-panel { + display: grid; + gap: 1.2rem; + padding: 1.05rem 0 0.2rem; + border-top: 1px solid var(--border-strong); + border-bottom: 1px solid var(--border-strong); +} + +.system-panel__lead { + display: grid; + align-content: start; + gap: 0.55rem; + min-width: 0; +} + +.system-panel__lead span { + color: var(--muted); + font-size: 0.72rem; + font-weight: 780; + line-height: 1.2; + text-transform: uppercase; +} + +.system-panel__lead strong { + max-width: 36rem; + color: var(--ink); + font-size: clamp(1.24rem, 2.4vw, 1.86rem); + font-weight: 820; + line-height: 1.08; +} + +.system-panel__links { + display: flex; + flex-wrap: wrap; + gap: 0.5rem 0.9rem; + margin-top: 0.12rem; +} + +.system-panel__links a { + position: relative; + color: var(--accent-strong); + font-size: 0.86rem; + font-weight: 760; + line-height: 1.25; +} + +.system-panel__links a::after, +.publisher-note a::after { + content: ""; + position: absolute; + right: 0; + bottom: -0.1rem; + left: 0; + height: 1px; + background: currentColor; + opacity: 0.45; + transform: scaleX(0); + transform-origin: right; + transition: + opacity 180ms ease, + transform 180ms ease; +} + +.system-panel__links a:hover, +.system-panel__links a:focus-visible, +.publisher-note a:hover, +.publisher-note a:focus-visible { + color: var(--ink); +} + +.system-panel__links a:hover::after, +.system-panel__links a:focus-visible::after, +.publisher-note a:hover::after, +.publisher-note a:focus-visible::after { + opacity: 0.85; + transform: scaleX(1); + transform-origin: left; +} + .system-loop { display: grid; grid-template-columns: minmax(0, 1fr); - border-top: 1px solid var(--border-strong); + margin: 0; + padding: 0; + list-style: none; } -.system-loop article { +.system-loop li { + position: relative; display: grid; - gap: 0.45rem; + grid-template-columns: 2.15rem minmax(0, 1fr); + gap: 0.9rem; + align-items: baseline; min-width: 0; - padding: 1rem 0; - border-bottom: 1px solid var(--border); + padding: 0.88rem 0; + border-top: 1px solid var(--border); + transition: + border-color 180ms ease, + transform 180ms ease; +} + +.system-loop li::before { + content: ""; + position: absolute; + top: 0.74rem; + bottom: 0.74rem; + left: -0.72rem; + width: 2px; + background: var(--accent); + opacity: 0; + transform: scaleY(0.45); + transition: + opacity 180ms ease, + transform 180ms ease; +} + +.system-loop li:hover { + border-top-color: var(--border-strong); + transform: translateX(0.1rem); +} + +.system-loop li:hover::before { + opacity: 1; + transform: scaleY(1); +} + +.system-loop li:hover > span { + color: var(--accent-strong); +} + +.system-loop li:first-child { + border-top: 0; } .system-loop h3 { @@ -697,21 +1151,29 @@ code { } .lead-brief { + position: relative; display: grid; align-content: start; - gap: 1rem; + gap: 0.95rem; min-width: 0; - padding: 1.2rem; - border: 1px solid var(--border); - border-radius: 0.85rem; - background: var(--panel); + padding: 0.3rem 0 1.15rem; + border-top: 1px solid var(--border-strong); + border-bottom: 1px solid var(--border); + background: transparent; + transition: + border-color 180ms ease, + transform 180ms ease; +} + +.lead-brief:hover { + border-top-color: var(--border-strong); } .lead-brief__meta, .signal-card__taxonomy { display: flex; flex-wrap: wrap; - gap: 0.38rem; + gap: 0.42rem; align-items: center; } @@ -719,20 +1181,30 @@ code { .signal-card__taxonomy span { display: inline-flex; align-items: center; - min-height: 1.52rem; - padding: 0.28rem 0.48rem; - border: 1px solid var(--border); - border-radius: 999px; + min-height: auto; + padding: 0; + border: 0; + border-radius: 0; color: var(--muted); line-height: 1; } +.lead-brief__meta span:not(:first-child)::before, +.signal-card__taxonomy span:not(:first-child)::before { + width: 0.22rem; + height: 0.22rem; + margin-right: 0.42rem; + border-radius: 50%; + background: var(--muted-soft); + content: ""; +} + .lead-brief h3 { - max-width: 16ch; + max-width: 18ch; color: var(--ink); - font-size: clamp(2rem, 4vw, 3.55rem); + font-size: clamp(1.9rem, 3.65vw, 3.1rem); font-weight: 820; - line-height: 0.98; + line-height: 1; } .lead-brief__summary { @@ -757,7 +1229,12 @@ code { .lead-brief__link { width: fit-content; - border-color: color-mix(in srgb, var(--signal) 80%, var(--border)); + min-height: auto; + padding: 0 0 0.18rem; + border: 0; + border-bottom: 2px solid color-mix(in srgb, var(--accent) 68%, transparent); + border-radius: 0; + color: var(--accent-strong); backdrop-filter: none; } @@ -795,9 +1272,13 @@ code { .brief-list li, .watch-list li { + position: relative; min-width: 0; padding: 0.75rem 0; border-bottom: 1px solid var(--border); + transition: + border-color 180ms ease, + transform 180ms ease; } .brief-list a, @@ -806,6 +1287,12 @@ code { gap: 0.28rem; } +.brief-list li:hover, +.watch-list li:hover { + border-bottom-color: var(--border-strong); + transform: translateX(0.08rem); +} + .brief-list span, .watch-list span { color: var(--muted); @@ -822,7 +1309,8 @@ code { line-height: 1.38; } -.brief-list a:hover strong { +.brief-list a:hover strong, +.brief-list a:focus-visible strong { color: var(--accent-strong); } @@ -854,6 +1342,12 @@ code { line-height: 1.6; } +.publisher-note a { + position: relative; + color: var(--accent-strong); + font-weight: 760; +} + .publisher-flow { display: grid; grid-template-columns: minmax(0, 1fr); @@ -861,6 +1355,7 @@ code { } .publisher-flow span { + position: relative; display: flex; align-items: center; min-height: 3rem; @@ -869,6 +1364,36 @@ code { color: var(--ink); font-size: 0.92rem; text-transform: none; + transition: + border-color 180ms ease, + color 180ms ease, + transform 180ms ease; +} + +.publisher-flow span::before { + content: ""; + position: absolute; + left: 0; + bottom: -1px; + width: min(8rem, 52%); + height: 1px; + background: var(--accent); + opacity: 0; + transform: scaleX(0); + transform-origin: left; + transition: + opacity 180ms ease, + transform 180ms ease; +} + +.publisher-flow span:hover { + color: var(--accent-strong); + transform: translateX(0.1rem); +} + +.publisher-flow span:hover::before { + opacity: 1; + transform: scaleX(1); } .feed-section { @@ -899,28 +1424,62 @@ code { .filter-bar { display: flex; flex-wrap: wrap; - gap: 0.42rem; + gap: 0.35rem 0.7rem; + padding-bottom: 0.1rem; } .filter-chip { + position: relative; display: inline-flex; align-items: center; justify-content: center; - min-height: 2rem; - padding: 0.45rem 0.72rem; - border: 1px solid var(--border); - border-radius: 999px; + min-height: auto; + padding: 0 0 0.22rem; + border: 0; + border-bottom: 2px solid transparent; + border-radius: 0; color: var(--muted); font-size: 0.78rem; font-weight: 760; - line-height: 1; + line-height: 1.2; + will-change: transform; +} + +.filter-chip::after { + content: ""; + position: absolute; + right: 0; + bottom: -2px; + left: 0; + height: 2px; + background: currentColor; + opacity: 0; + transform: scaleX(0); + transform-origin: right; + transition: + opacity 180ms ease, + transform 180ms ease; } .filter-chip:hover, +.filter-chip:focus-visible, .filter-chip[data-active="true"] { border-color: var(--ink); - background: var(--ink); - color: var(--panel); + background: transparent; + color: var(--ink); + transform: translateY(-0.04rem); +} + +.filter-chip:hover::after, +.filter-chip:focus-visible::after, +.filter-chip[data-active="true"]::after { + opacity: 1; + transform: scaleX(1); + transform-origin: left; +} + +.filter-chip[data-pressed="true"] { + transform: translateY(0) scale(0.98); } .feed-region { @@ -930,7 +1489,7 @@ code { } .feed-region--filtering { - animation: feed-filter-shift 180ms ease; + animation: feed-filter-shift 220ms cubic-bezier(0.2, 0.8, 0.2, 1); } @keyframes feed-filter-shift { @@ -964,6 +1523,8 @@ code { } .signal-card { + position: relative; + isolation: isolate; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.75rem; @@ -971,6 +1532,24 @@ code { padding: 1rem 0 1.1rem; border-top: 1px solid var(--border); scroll-margin-top: 1rem; + transition: + background-color 220ms ease, + border-color 180ms ease, + transform 180ms ease; +} + +.signal-card::before { + content: ""; + position: absolute; + inset: 0 -0.72rem; + z-index: -1; + border-radius: 0.5rem; + background: color-mix(in srgb, var(--panel-soft) 48%, transparent); + opacity: 0; + transform: scaleY(0.985); + transition: + opacity 180ms ease, + transform 180ms ease; } .signal-card[hidden], @@ -983,6 +1562,19 @@ code { border-top-color: var(--accent); } +.signal-card:hover, +.signal-card[data-evidence-open="true"], +.signal-card:target { + border-top-color: var(--border-strong); +} + +.signal-card:hover::before, +.signal-card[data-evidence-open="true"]::before, +.signal-card:target::before { + opacity: 1; + transform: scaleY(1); +} + .signal-card__index { display: flex; flex-wrap: wrap; @@ -998,6 +1590,11 @@ code { color: var(--accent-strong); } +.signal-card__index a:hover, +.signal-card__index a:focus-visible { + color: var(--ink); +} + .signal-card__body { display: grid; gap: 0.9rem; @@ -1045,6 +1642,13 @@ code { display: grid; gap: 0.32rem; min-width: 0; + transition: + border-color 180ms ease, + transform 180ms ease; +} + +.signal-card__readout section:hover { + transform: translateY(-0.04rem); } .signal-card__readout p { @@ -1081,6 +1685,11 @@ code { .signal-card__evidence { padding-top: 0.65rem; border-top: 1px solid var(--border); + transition: border-color 180ms ease; +} + +.signal-card__evidence[open] { + border-top-color: var(--border-strong); } .signal-card__evidence summary { @@ -1094,6 +1703,9 @@ code { font-weight: 760; line-height: 1.25; list-style: none; + transition: + color 180ms ease, + transform 180ms ease; } .signal-card__evidence summary::-webkit-details-marker { @@ -1101,17 +1713,62 @@ code { } .signal-card__evidence summary span:last-child { + margin-left: auto; color: var(--muted-soft); font-size: 0.76rem; font-weight: 700; } +.signal-card__evidence summary::after { + content: ""; + width: 0.46rem; + height: 0.46rem; + border-right: 1.5px solid currentColor; + border-bottom: 1.5px solid currentColor; + opacity: 0.66; + transform: rotate(45deg) translateY(-0.08rem); + transform-origin: center; + transition: + opacity 180ms ease, + transform 180ms ease; +} + +.signal-card__evidence summary:hover, +.signal-card__evidence summary:focus-visible { + color: var(--accent-strong); +} + +.signal-card__evidence[open] summary { + color: var(--ink); +} + +.signal-card__evidence[open] summary::after { + opacity: 0.92; + transform: rotate(225deg) translateY(-0.02rem); +} + .signal-card__evidence-body { display: grid; gap: 0.9rem; padding-top: 0.85rem; } +.signal-card__evidence[open] .signal-card__evidence-body { + animation: evidence-reveal 240ms cubic-bezier(0.2, 0.8, 0.2, 1); +} + +@keyframes evidence-reveal { + from { + opacity: 0; + transform: translateY(-0.3rem); + } + + to { + opacity: 1; + transform: translateY(0); + } +} + .signal-proof-list { display: grid; gap: 0.5rem; @@ -1137,6 +1794,14 @@ code { height: 0.32rem; border-radius: 999px; background: var(--accent); + transition: + background-color 180ms ease, + transform 180ms ease; +} + +.signal-proof-item:hover::before { + background: var(--signal); + transform: scale(1.18); } .signal-card__caveats { @@ -1175,7 +1840,8 @@ code { color: var(--ink-soft); } -.signal-source-list a:hover { +.signal-source-list a:hover, +.signal-source-list a:focus-visible { color: var(--accent-strong); } @@ -1224,6 +1890,24 @@ code { white-space: normal; } +.reveal-ready { + opacity: 0; + filter: blur(3px); + transform: translate3d(0, 0.82rem, 0); + transition: + filter 520ms cubic-bezier(0.2, 0.8, 0.2, 1), + opacity 520ms cubic-bezier(0.2, 0.8, 0.2, 1), + transform 520ms cubic-bezier(0.2, 0.8, 0.2, 1); + transition-delay: var(--reveal-delay, 0ms); + will-change: filter, opacity, transform; +} + +.reveal-ready.is-visible { + opacity: 1; + filter: blur(0); + transform: translate3d(0, 0, 0); +} + @media (prefers-reduced-motion: reduce) { *, *::before, @@ -1233,6 +1917,12 @@ code { scroll-behavior: auto !important; transition-duration: 1ms !important; } + + .reveal-ready { + opacity: 1; + filter: none; + transform: none; + } } @media (min-width: 720px) { @@ -1246,10 +1936,6 @@ code { padding-top: 2.8rem; } - .hero-console { - align-self: end; - } - .hero-bottom { grid-template-columns: repeat(4, minmax(0, 1fr)); } @@ -1262,22 +1948,57 @@ code { border-right: 0; } - .system-loop { - grid-template-columns: repeat(4, minmax(0, 1fr)); + .utility-strip__inner { + grid-template-columns: minmax(18rem, 0.7fr) minmax(0, 1.3fr); + gap: 2rem; + align-items: start; } - .system-loop article { - padding: 1rem 1rem 1.1rem; - border-right: 1px solid var(--border); + .utility-row { + grid-template-columns: minmax(8.5rem, 0.34fr) minmax(0, 1fr); } - .system-loop article:first-child { - padding-left: 0; + .utility-row > :not(span) { + justify-self: end; + text-align: right; } - .system-loop article:last-child { - padding-right: 0; - border-right: 0; + .utility-row .appcast-download__body { + justify-items: end; + } + + .utility-row .appcast-download__primary { + justify-content: flex-end; + text-align: right; + } + + .utility-row .reset-inline { + justify-content: flex-end; + } + + .utility-row--window a { + justify-items: end; + } + + .system-panel { + grid-template-columns: minmax(18rem, 0.72fr) minmax(0, 1.28fr); + gap: 2rem; + align-items: start; + padding: 1.15rem 0; + } + + .system-panel__lead { + position: sticky; + top: 1rem; + } + + .system-loop li { + grid-template-columns: 2.65rem minmax(0, 1fr); + padding: 0.76rem 0; + } + + .system-loop li:first-child { + padding-top: 0; } .radar-layout { @@ -1368,10 +2089,6 @@ code { font-size: 1rem; } - .hero-console { - padding: 0.65rem; - } - .hero-bottom { padding: 0 0.9rem 0.9rem; } From 0ffe2afa185873553aabf732518aae729dbd54df Mon Sep 17 00:00:00 2001 From: Yvette Carlisle Date: Thu, 14 May 2026 10:59:48 +0800 Subject: [PATCH 12/12] {"schema":"decodex/commit/1","summary":"Redesign Decodex homepage signal experience","authority":"manual"} --- .../components/AppcastDownloadWidget.astro | 14 +- site/src/components/EmptyFeedState.astro | 6 +- site/src/components/ResetStatusWidget.astro | 2 +- site/src/content/reset-status/latest.json | 2 +- site/src/lib/reset-status.ts | 2 +- site/src/lib/signal-feed.ts | 14 +- site/src/pages/index.astro | 77 +-- site/src/styles/global.css | 610 ++++++++++-------- 8 files changed, 379 insertions(+), 348 deletions(-) diff --git a/site/src/components/AppcastDownloadWidget.astro b/site/src/components/AppcastDownloadWidget.astro index a46954ea..551fb23c 100644 --- a/site/src/components/AppcastDownloadWidget.astro +++ b/site/src/components/AppcastDownloadWidget.astro @@ -1,7 +1,7 @@ --- const appcastUrl = "https://persistent.oaistatic.com/codex-app-beta/appcast.xml"; const appName = "Codex (Beta).app"; -const appDownloadLabel = "Download Codex Beta"; +const appDownloadLabel = "Download Codex beta"; ---
@@ -17,13 +17,11 @@ const appDownloadLabel = "Download Codex Beta"; data-appcast-primary > - - Public beta + + Latest Codex app + Checking latest build - - {appDownloadLabel} - - Checking latest build + {appDownloadLabel} @@ -135,7 +133,7 @@ const appDownloadLabel = "Download Codex Beta"; primary.href = latest.url; primary.setAttribute("aria-label", `Download ${appName} ${latest.shortVersion}`); const dateLabel = appcastFormatDate(latest.pubDate); - meta.textContent = dateLabel.length > 0 ? `Latest ${latest.shortVersion} · ${dateLabel}` : `Latest ${latest.shortVersion}`; + meta.textContent = dateLabel.length > 0 ? `${latest.shortVersion} · ${dateLabel}` : latest.shortVersion; } function appcastRenderList(root, items, appName) { diff --git a/site/src/components/EmptyFeedState.astro b/site/src/components/EmptyFeedState.astro index 69498196..a5b05fa9 100644 --- a/site/src/components/EmptyFeedState.astro +++ b/site/src/components/EmptyFeedState.astro @@ -17,12 +17,12 @@ const messages: Record = { body: "The current collection is empty or still waiting for the first rendered GitHub-backed signal.", }, "try-now": { - title: "No try-now entries match yet.", + title: "No try paths match yet.", body: "This filter only shows signals with a concrete user test path.", }, "high-impact": { - title: "No high-impact entries yet.", - body: "High-impact is reserved for the smaller set of changes that clearly alter how users should think about Codex.", + title: "No high impact signals yet.", + body: "High impact is reserved for the smaller set of changes that clearly alter how users should think about Codex.", }, }; diff --git a/site/src/components/ResetStatusWidget.astro b/site/src/components/ResetStatusWidget.astro index 9bb87712..b7d5bcc3 100644 --- a/site/src/components/ResetStatusWidget.astro +++ b/site/src/components/ResetStatusWidget.astro @@ -20,7 +20,7 @@ const answer = resetStatusAnswerLabel(status?.answer ?? "unknown"); const tone = resetStatusTone(status?.answer ?? "unknown"); const title = status ? `${status.source_account} on ${status.observed_for_date}: ${status.rationale}` - : "Reset watch status has not been generated yet."; + : "Rate limit reset status has not been generated yet."; --- 0 ? signals : [previewSignal]; @@ -153,7 +153,7 @@ const releaseWindow = const productLoops = [ { - title: "Control Plane", + title: "Control plane", body: "Project registry, identity routing, signing policy, review handoff, and landing rules.", }, { @@ -303,7 +303,6 @@ const interactionRuntimeScript = `(function () { ".filter-chip", ".appcast-download__primary", ".appcast-download__version", - ".system-panel__links a", ".brief-list a", ".utility-row--window a", ".signal-card__index a", @@ -539,6 +538,33 @@ const interactionRuntimeScript = `(function () {
+
+
+
+ +
+ { + releaseWindow ? ( +
+ + Upstream + · + {releaseWindow.commits} commits + + + + {releaseWindow.stable} → {releaseWindow.preview} + + +
+ ) : null + } +
+ Rate limit reset + +
+
+
@@ -561,34 +587,6 @@ const interactionRuntimeScript = `(function () {
-
-
-
- Live status -

Beta downloads, reset watch, and the current tracked release window.

-
-
-
- Codex app feed - -
-
- Reset watch - -
- {releaseWindow ? ( -
- Upstream window - - {releaseWindow.stable} -> {releaseWindow.preview} - {releaseWindow.commits} commits under watch - -
- ) : null} -
-
-
-

Automation map

@@ -600,11 +598,6 @@ const interactionRuntimeScript = `(function () {
Decodex software Operate work, track impact, and keep delivery policy explicit. -
- GitHub - @YvetteCipher - @decodexspace bot -
    {productLoops.map((item, index) => ( @@ -650,7 +643,7 @@ const interactionRuntimeScript = `(function () { set:html={renderMarkdownInline(leadSignal.how_to_try ?? leadSignal.watch_state ?? leadSignal.summary)} />
- Open the evidence + Open evidence
@@ -690,14 +683,14 @@ const interactionRuntimeScript = `(function () {

Publisher output

- Public updates from the analyzed source set. + Source-backed updates for the community channel.

- Draft logic + Output path

- Drafts separate the change, the audience, and any B-side follow-up. Bot: @decodexspace. + Commit evidence becomes short X posts, release rollups, and B-side follow-up notes. Bot channel: @decodexspace.

diff --git a/site/src/styles/global.css b/site/src/styles/global.css index b339303a..d73a3e86 100644 --- a/site/src/styles/global.css +++ b/site/src/styles/global.css @@ -33,6 +33,11 @@ --stage-control-bg: rgba(255, 255, 255, 0.58); --stage-control-border: rgba(12, 22, 38, 0.14); --stage-control-hover: rgba(12, 22, 38, 0.06); + --stage-action-hover-bg: rgba(12, 22, 38, 0.075); + --stage-action-hover-border: rgba(12, 22, 38, 0.22); + --stage-action-hover-ink: var(--stage-ink); + --stage-primary-action-hover-bg: var(--signal); + --stage-primary-action-hover-ink: var(--signal-ink); --stage-glass-bg: rgba(255, 255, 255, 0.48); --stage-glass-bg-hover: rgba(255, 255, 255, 0.64); --stage-selected-bg: #0d1726; @@ -87,6 +92,11 @@ --stage-control-bg: rgba(15, 22, 32, 0.72); --stage-control-border: rgba(255, 255, 255, 0.14); --stage-control-hover: rgba(255, 255, 255, 0.08); + --stage-action-hover-bg: rgba(182, 241, 58, 0.1); + --stage-action-hover-border: rgba(182, 241, 58, 0.48); + --stage-action-hover-ink: var(--signal); + --stage-primary-action-hover-bg: var(--signal); + --stage-primary-action-hover-ink: var(--signal-ink); --stage-glass-bg: rgba(10, 15, 23, 0.38); --stage-glass-bg-hover: rgba(10, 15, 23, 0.54); --stage-selected-bg: #f5f7ff; @@ -139,6 +149,11 @@ --stage-control-bg: rgba(15, 22, 32, 0.72); --stage-control-border: rgba(255, 255, 255, 0.14); --stage-control-hover: rgba(255, 255, 255, 0.08); + --stage-action-hover-bg: rgba(182, 241, 58, 0.1); + --stage-action-hover-border: rgba(182, 241, 58, 0.48); + --stage-action-hover-ink: var(--signal); + --stage-primary-action-hover-bg: var(--signal); + --stage-primary-action-hover-ink: var(--signal-ink); --stage-glass-bg: rgba(10, 15, 23, 0.38); --stage-glass-bg-hover: rgba(10, 15, 23, 0.54); --stage-selected-bg: #f5f7ff; @@ -429,6 +444,12 @@ code { padding: 2.2rem 1.15rem 1.8rem; } +.hero-grid:has(.appcast-download:hover), +.hero-grid:has(.appcast-download:focus-within), +.hero-grid:has(.appcast-download[data-appcast-open="true"]) { + z-index: 30; +} + .hero-copy { display: grid; gap: 1.05rem; @@ -481,19 +502,18 @@ code { } .hero-actions a:hover, -.hero-actions a:focus-visible, -.lead-brief__link:hover, -.lead-brief__link:focus-visible { - border-color: var(--signal); - color: var(--signal); +.hero-actions a:focus-visible { + border-color: var(--stage-action-hover-border); + background: var(--stage-action-hover-bg); + color: var(--stage-action-hover-ink); transform: translateY(-0.08rem); } .hero-actions a:first-child:hover, -.hero-actions a:first-child:focus-visible, -.lead-brief__link:hover, -.lead-brief__link:focus-visible { - color: var(--signal); +.hero-actions a:first-child:focus-visible { + border-color: var(--stage-primary-action-hover-bg); + background: var(--stage-primary-action-hover-bg); + color: var(--stage-primary-action-hover-ink); } .hero-actions a[data-pressed="true"], @@ -538,27 +558,18 @@ code { gap: 0.25rem; min-width: 0; padding: 0.78rem 0.65rem; - border-top: 1px solid var(--stage-border); - border-right: 1px solid var(--stage-border); background: var(--stage-glass-bg); backdrop-filter: blur(16px); transition: background-color 180ms ease, - border-color 180ms ease, transform 180ms ease; } .hero-bottom div:hover { - border-top-color: color-mix(in srgb, var(--signal) 34%, var(--stage-border)); background: var(--stage-glass-bg-hover); transform: translateY(-0.08rem); } -.hero-bottom div:nth-child(2n), -.hero-bottom div:last-child { - border-right: 0; -} - .hero-bottom strong { color: var(--stage-ink); font-size: 1.08rem; @@ -583,7 +594,7 @@ code { .appcast-download__primary { display: flex; - align-items: start; + align-items: baseline; justify-content: space-between; width: 100%; min-width: 0; @@ -603,24 +614,15 @@ code { .appcast-download__body { display: grid; - gap: 0.14rem; + gap: 0.16rem; min-width: 0; } -.appcast-download__kicker, .appcast-download__title-row { display: flex; min-width: 0; } -.appcast-download__eyebrow { - color: var(--signal); - font-size: 0.64rem; - font-weight: 780; - line-height: 1; - text-transform: uppercase; -} - .appcast-download__title { color: var(--stage-ink); font-size: 0.88rem; @@ -639,7 +641,7 @@ code { .appcast-download:hover .appcast-download__title, .appcast-download:focus-within .appcast-download__title, .appcast-download__primary:focus-visible .appcast-download__title { - color: var(--signal); + color: var(--stage-action-hover-ink); } .appcast-download__primary[data-pressed="true"] { @@ -651,11 +653,11 @@ code { right: 0; top: calc(100% + 0.54rem); bottom: auto; - z-index: 30; + z-index: 120; display: grid; gap: 0.42rem; - width: min(17.5rem, calc(100vw - 2rem)); - min-width: min(15rem, calc(100vw - 2rem)); + width: min(13.6rem, calc(100vw - 2rem)); + min-width: min(13rem, calc(100vw - 2rem)); max-height: none; padding: 0.62rem; border: 1px solid var(--appcast-menu-border); @@ -663,6 +665,7 @@ code { background: var(--appcast-menu-bg); box-shadow: var(--appcast-menu-shadow); color: var(--appcast-menu-ink); + text-align: left; clip-path: inset(0 0 7% 0 round 0.65rem); filter: blur(2px) saturate(0.92); opacity: 0; @@ -705,7 +708,7 @@ code { .appcast-download__list { display: grid; gap: 0.12rem; - max-height: 11.8rem; + max-height: 10.4rem; margin: 0; padding: 0 0.18rem 0 0; overflow-y: auto; @@ -732,8 +735,10 @@ code { justify-content: space-between; gap: 0.8rem; min-width: 0; - padding: 0.4rem 0.45rem; + min-height: 2rem; + padding: 0.32rem 0.4rem; border-radius: 0.45rem; + line-height: 1.2; will-change: transform; } @@ -834,74 +839,92 @@ code { .utility-strip { position: relative; - z-index: 4; - width: min(100%, 82rem); - margin: 0 auto; - padding: 1.2rem 1.15rem 0; + z-index: 20; + width: 100%; + margin: 0; + padding: 0; overflow: visible; } -.utility-strip__inner { - display: grid; - grid-template-columns: minmax(0, 1fr); - gap: 1rem; - padding: 1rem 0; - border-top: 1px solid var(--border-strong); - border-bottom: 1px solid var(--border-strong); -} - -.utility-strip__intro { - display: grid; - gap: 0.34rem; - min-width: 0; -} - -.utility-strip__intro span, -.utility-row > span { - color: var(--muted); - font-size: 0.72rem; +.utility-row__label, +.appcast-download__kicker { + color: var(--stage-muted); + font-size: 0.66rem; font-weight: 780; line-height: 1.2; text-transform: uppercase; } -.utility-strip__intro p { - max-width: 38rem; - color: var(--ink-soft); - font-size: 0.94rem; - line-height: 1.52; +.utility-row__label { + display: inline-flex; + align-items: baseline; + justify-content: flex-end; + max-width: 100%; + white-space: nowrap; +} + +.utility-row__label-meta { + color: var(--stage-soft); + font-weight: 700; + text-transform: none; } .utility-strip__items { display: grid; - grid-template-columns: minmax(0, 1fr); - gap: 0; + grid-template-columns: repeat(auto-fit, minmax(9.4rem, 1fr)); + justify-items: stretch; + gap: 0.18rem; min-width: 0; } .utility-row { position: relative; + z-index: 1; display: grid; - grid-template-columns: minmax(7rem, 0.36fr) minmax(0, 1fr); - gap: 0.6rem 1rem; - align-items: baseline; + grid-template-columns: minmax(0, 1fr); + justify-items: end; + gap: 0.18rem; + align-content: center; + justify-self: end; min-width: 0; - padding: 0.7rem 0; - border-top: 1px solid var(--border); + width: 100%; + height: 2.55rem; + padding: 0.24rem 0; + border-radius: 0.34rem; + background: transparent; + backdrop-filter: none; + text-align: right; transition: - border-color 180ms ease, + background-color 180ms ease, transform 180ms ease; } +.utility-row--download { + z-index: 3; +} + +.utility-row--reset { + min-width: 0; +} + +.utility-row--download:hover, +.utility-row--download:focus-within, +.utility-row--download:has(.appcast-download[data-appcast-open="true"]) { + z-index: 80; +} + .utility-row::before { content: ""; position: absolute; - inset: 0 -0.62rem; - border-radius: 0.42rem; - background: color-mix(in srgb, var(--accent-soft) 44%, transparent); + right: 0; + bottom: 0.1rem; + width: min(100%, 13rem); + height: 1px; + background: color-mix(in srgb, var(--stage-muted) 24%, transparent); opacity: 0; pointer-events: none; - transform: scaleX(0.985); + transform: scaleX(0.72); + transform-origin: right; transition: opacity 180ms ease, transform 180ms ease; @@ -911,11 +934,6 @@ code { position: relative; } -.utility-row:hover, -.utility-row:focus-within { - border-top-color: var(--border-strong); -} - .utility-row:hover::before, .utility-row:focus-within::before { opacity: 1; @@ -923,36 +941,83 @@ code { } .utility-row:first-child { - border-top: 0; - padding-top: 0; + padding-top: 0.24rem; } .utility-row:last-child { - padding-bottom: 0; + padding-bottom: 0.24rem; } -.utility-row .appcast-download__eyebrow { - color: var(--accent-strong); +.utility-row .appcast-download__primary { + justify-content: flex-end; + text-align: right; +} + +.utility-row .appcast-download__body { + display: grid; + justify-items: end; + gap: 0.18rem; + max-width: 100%; + white-space: nowrap; +} + +.appcast-download__meta-row { + display: inline-flex; + align-items: baseline; + justify-content: flex-end; + max-width: 100%; + white-space: nowrap; +} + +.appcast-download__meta-row .appcast-download__meta::before { + margin-inline: 0.35rem; + color: var(--stage-muted); + content: "·"; } .utility-row .appcast-download__title, .utility-row .reset-inline__question, .utility-row .reset-inline__answer, .utility-row--window strong { - color: var(--ink); + color: var(--stage-ink); + font-size: 0.92rem; + line-height: 1.18; } -.utility-row .appcast-download__meta, +.appcast-download__meta, .utility-row small { - color: var(--ink-soft); + color: var(--stage-soft); + font-size: 0.82rem; + line-height: 1.18; + white-space: nowrap; +} + +.utility-row--reset .reset-inline { + justify-content: flex-end; +} + +.utility-row--reset .reset-inline__question { + display: none; +} + +.utility-row--reset .reset-inline__answer { + font-size: 0.92rem; + font-weight: 820; } .utility-row--window a { - display: grid; - gap: 0.24rem; + display: flex; + align-items: baseline; + justify-content: flex-end; + text-align: right; + white-space: nowrap; will-change: transform; } +.utility-row--window strong { + white-space: nowrap; +} + .utility-row--window a:hover, .utility-row--window a:focus-visible { transform: translateY(-0.04rem); @@ -963,15 +1028,35 @@ code { color: var(--accent-strong); } +.release-arrow { + display: inline-block; + color: var(--stage-muted); + font-weight: 760; + transform: translateY(-0.02em); +} + +.utility-separator { + margin-inline: 0.24rem; + color: var(--stage-muted); + font-weight: 760; +} + +.utility-inline-meta { + color: var(--stage-soft); + font-size: 0.88em; + font-weight: 680; +} + .utility-row--window small { - font-size: 0.82rem; - line-height: 1.3; + flex: 0 0 auto; + font-size: 0.78rem; + line-height: 1.18; } .site-section { width: min(100%, 82rem); margin: 0 auto; - padding: 4rem 1.15rem 0; + padding: 3.25rem 1.15rem 0; scroll-margin-top: 1.25rem; } @@ -979,12 +1064,12 @@ code { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.65rem; - margin-bottom: 1.35rem; + margin-bottom: 1.05rem; } .section-heading h2 { color: var(--ink); - font-size: clamp(2.1rem, 4vw, 4rem); + font-size: clamp(2rem, 3.6vw, 3.6rem); font-weight: 830; line-height: 0.98; } @@ -997,17 +1082,30 @@ code { } .system-panel { + position: relative; display: grid; - gap: 1.2rem; - padding: 1.05rem 0 0.2rem; - border-top: 1px solid var(--border-strong); - border-bottom: 1px solid var(--border-strong); + gap: 0.9rem; + padding: 1rem 0 1rem 0.95rem; + border-block: 1px solid color-mix(in srgb, var(--border) 58%, transparent); +} + +.system-panel::before, +.radar-layout::before, +.publisher-board::before { + position: absolute; + top: 1rem; + bottom: 1rem; + left: 0; + width: 2px; + background: linear-gradient(180deg, var(--accent), color-mix(in srgb, var(--accent) 8%, transparent)); + content: ""; + opacity: 0.46; } .system-panel__lead { display: grid; align-content: start; - gap: 0.55rem; + gap: 0.45rem; min-width: 0; } @@ -1020,29 +1118,13 @@ code { } .system-panel__lead strong { - max-width: 36rem; + max-width: 32rem; color: var(--ink); - font-size: clamp(1.24rem, 2.4vw, 1.86rem); + font-size: clamp(1.15rem, 2vw, 1.55rem); font-weight: 820; - line-height: 1.08; -} - -.system-panel__links { - display: flex; - flex-wrap: wrap; - gap: 0.5rem 0.9rem; - margin-top: 0.12rem; -} - -.system-panel__links a { - position: relative; - color: var(--accent-strong); - font-size: 0.86rem; - font-weight: 760; - line-height: 1.25; + line-height: 1.12; } -.system-panel__links a::after, .publisher-note a::after { content: ""; position: absolute; @@ -1059,15 +1141,11 @@ code { transform 180ms ease; } -.system-panel__links a:hover, -.system-panel__links a:focus-visible, .publisher-note a:hover, .publisher-note a:focus-visible { color: var(--ink); } -.system-panel__links a:hover::after, -.system-panel__links a:focus-visible::after, .publisher-note a:hover::after, .publisher-note a:focus-visible::after { opacity: 0.85; @@ -1078,6 +1156,7 @@ code { .system-loop { display: grid; grid-template-columns: minmax(0, 1fr); + gap: 0.38rem; margin: 0; padding: 0; list-style: none; @@ -1086,14 +1165,15 @@ code { .system-loop li { position: relative; display: grid; - grid-template-columns: 2.15rem minmax(0, 1fr); - gap: 0.9rem; + grid-template-columns: 1.85rem minmax(0, 1fr); + gap: 0.68rem; align-items: baseline; min-width: 0; - padding: 0.88rem 0; - border-top: 1px solid var(--border); + padding: 0.58rem 0.68rem; + border-radius: 0.34rem; + background: color-mix(in srgb, var(--panel-soft) 24%, transparent); transition: - border-color 180ms ease, + background-color 180ms ease, transform 180ms ease; } @@ -1102,7 +1182,7 @@ code { position: absolute; top: 0.74rem; bottom: 0.74rem; - left: -0.72rem; + left: 0; width: 2px; background: var(--accent); opacity: 0; @@ -1113,7 +1193,7 @@ code { } .system-loop li:hover { - border-top-color: var(--border-strong); + background: color-mix(in srgb, var(--accent-soft) 24%, transparent); transform: translateX(0.1rem); } @@ -1126,47 +1206,40 @@ code { color: var(--accent-strong); } -.system-loop li:first-child { - border-top: 0; -} - .system-loop h3 { color: var(--ink); - font-size: 1.08rem; + font-size: 0.98rem; font-weight: 800; line-height: 1.18; } .system-loop p { color: var(--ink-soft); - font-size: 0.94rem; - line-height: 1.55; + font-size: 0.88rem; + line-height: 1.42; } .radar-layout { + position: relative; display: grid; grid-template-columns: minmax(0, 1fr); - gap: 1rem; + gap: 0.9rem; align-items: start; + padding: 1rem 0 1rem 0.95rem; + border-block: 1px solid color-mix(in srgb, var(--border) 58%, transparent); } .lead-brief { position: relative; display: grid; align-content: start; - gap: 0.95rem; + gap: 0.75rem; min-width: 0; - padding: 0.3rem 0 1.15rem; - border-top: 1px solid var(--border-strong); - border-bottom: 1px solid var(--border); - background: transparent; - transition: - border-color 180ms ease, - transform 180ms ease; -} - -.lead-brief:hover { - border-top-color: var(--border-strong); + padding: 0.9rem 0.95rem 1rem; + border-radius: 0.36rem; + background: + linear-gradient(90deg, color-mix(in srgb, var(--panel-soft) 58%, transparent), transparent 88%), + color-mix(in srgb, var(--panel-soft) 18%, transparent); } .lead-brief__meta, @@ -1200,31 +1273,30 @@ code { } .lead-brief h3 { - max-width: 18ch; + max-width: 20ch; color: var(--ink); - font-size: clamp(1.9rem, 3.65vw, 3.1rem); + font-size: clamp(1.65rem, 2.8vw, 2.4rem); font-weight: 820; - line-height: 1; + line-height: 1.04; } .lead-brief__summary { max-width: 44rem; color: var(--ink-soft); - font-size: 1.03rem; - line-height: 1.58; + font-size: 0.96rem; + line-height: 1.5; } .lead-brief__action { display: grid; gap: 0.35rem; - padding-top: 0.95rem; - border-top: 1px solid var(--border); + padding-top: 0.3rem; } .lead-brief__action p { color: var(--ink); - font-size: 0.96rem; - line-height: 1.55; + font-size: 0.9rem; + line-height: 1.48; } .lead-brief__link { @@ -1238,16 +1310,23 @@ code { backdrop-filter: none; } +.lead-brief__link:hover, +.lead-brief__link:focus-visible { + border-bottom-color: var(--ink); + color: var(--ink); + transform: translateY(-0.08rem); +} + .radar-stack { display: grid; - gap: 1.15rem; + gap: 0.75rem; min-width: 0; } .brief-list, .watch-list { display: grid; - gap: 0.75rem; + gap: 0.55rem; min-width: 0; } @@ -1263,10 +1342,9 @@ code { .brief-list ol, .watch-list ul { display: grid; - gap: 0; + gap: 0.36rem; margin: 0; padding: 0; - border-top: 1px solid var(--border); list-style: none; } @@ -1274,10 +1352,11 @@ code { .watch-list li { position: relative; min-width: 0; - padding: 0.75rem 0; - border-bottom: 1px solid var(--border); + padding: 0.48rem 0.55rem; + border-radius: 0.3rem; + background: color-mix(in srgb, var(--panel-soft) 24%, transparent); transition: - border-color 180ms ease, + background-color 180ms ease, transform 180ms ease; } @@ -1289,7 +1368,7 @@ code { .brief-list li:hover, .watch-list li:hover { - border-bottom-color: var(--border-strong); + background: color-mix(in srgb, var(--accent-soft) 20%, transparent); transform: translateX(0.08rem); } @@ -1315,31 +1394,39 @@ code { } .watch-list p { + display: -webkit-box; + overflow: hidden; color: var(--ink-soft); font-size: 0.9rem; line-height: 1.5; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; } .publisher-board { + position: relative; display: grid; grid-template-columns: minmax(0, 1fr); - gap: 1rem; - align-items: stretch; - border-top: 1px solid var(--border-strong); - border-bottom: 1px solid var(--border-strong); + gap: 0.8rem; + align-items: start; + padding: 0.82rem 0.9rem; + border-radius: 0.42rem; + border: 1px solid color-mix(in srgb, var(--border) 58%, transparent); + background: color-mix(in srgb, var(--panel-soft) 34%, transparent); } .publisher-note { display: grid; - gap: 0.45rem; - padding: 1.1rem 0; + gap: 0.28rem; + min-width: 0; + padding: 0; } .publisher-note p { - max-width: 46rem; + max-width: 42rem; color: var(--ink-soft); - font-size: 1rem; - line-height: 1.6; + font-size: 0.94rem; + line-height: 1.48; } .publisher-note a { @@ -1349,51 +1436,42 @@ code { } .publisher-flow { - display: grid; - grid-template-columns: minmax(0, 1fr); - gap: 0; + display: flex; + flex-wrap: wrap; + gap: 0.38rem; + min-width: 0; } .publisher-flow span { position: relative; - display: flex; + display: inline-flex; align-items: center; - min-height: 3rem; - padding: 0.82rem 0; - border-top: 1px solid var(--border); + min-height: 2.25rem; + padding: 0.42rem 0.62rem; + border-radius: 0.32rem; + background: var(--panel); color: var(--ink); - font-size: 0.92rem; + font-size: 0.84rem; + font-weight: 760; text-transform: none; transition: - border-color 180ms ease, + background-color 180ms ease, color 180ms ease, transform 180ms ease; } .publisher-flow span::before { - content: ""; - position: absolute; - left: 0; - bottom: -1px; - width: min(8rem, 52%); - height: 1px; - background: var(--accent); - opacity: 0; - transform: scaleX(0); - transform-origin: left; - transition: - opacity 180ms ease, - transform 180ms ease; + content: none; } .publisher-flow span:hover { + background: color-mix(in srgb, var(--accent-soft) 22%, transparent); color: var(--accent-strong); transform: translateX(0.1rem); } .publisher-flow span:hover::before { - opacity: 1; - transform: scaleX(1); + content: none; } .feed-section { @@ -1406,7 +1484,6 @@ code { gap: 1rem; align-items: end; padding-top: 1.1rem; - border-top: 1px solid var(--border-strong); } .feed-toolbar__copy { @@ -1519,7 +1596,7 @@ code { .feed-group__items { display: grid; - gap: 0.8rem; + gap: 0.72rem; } .signal-card { @@ -1529,12 +1606,11 @@ code { grid-template-columns: minmax(0, 1fr); gap: 0.75rem; min-width: 0; - padding: 1rem 0 1.1rem; - border-top: 1px solid var(--border); + padding: 1.1rem 0.9rem 1.2rem; + border-radius: 0.42rem; scroll-margin-top: 1rem; transition: background-color 220ms ease, - border-color 180ms ease, transform 180ms ease; } @@ -1545,7 +1621,7 @@ code { z-index: -1; border-radius: 0.5rem; background: color-mix(in srgb, var(--panel-soft) 48%, transparent); - opacity: 0; + opacity: 0.42; transform: scaleY(0.985); transition: opacity 180ms ease, @@ -1558,20 +1634,10 @@ code { display: none; } -.signal-card:target { - border-top-color: var(--accent); -} - -.signal-card:hover, -.signal-card[data-evidence-open="true"], -.signal-card:target { - border-top-color: var(--border-strong); -} - .signal-card:hover::before, .signal-card[data-evidence-open="true"]::before, .signal-card:target::before { - opacity: 1; + opacity: 0.72; transform: scaleY(1); } @@ -1633,18 +1699,14 @@ code { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.75rem; - padding: 0.95rem 0; - border-top: 1px solid var(--border); - border-bottom: 1px solid var(--border); + padding: 0.35rem 0; } .signal-card__readout section { display: grid; gap: 0.32rem; min-width: 0; - transition: - border-color 180ms ease, - transform 180ms ease; + transition: transform 180ms ease; } .signal-card__readout section:hover { @@ -1684,12 +1746,6 @@ code { .signal-card__evidence { padding-top: 0.65rem; - border-top: 1px solid var(--border); - transition: border-color 180ms ease; -} - -.signal-card__evidence[open] { - border-top-color: var(--border-strong); } .signal-card__evidence summary { @@ -1814,7 +1870,6 @@ code { gap: 0.45rem; margin: 0; padding: 0.75rem 0 0; - border-top: 1px solid var(--border); list-style: none; } @@ -1940,79 +1995,68 @@ code { grid-template-columns: repeat(4, minmax(0, 1fr)); } - .hero-bottom div:nth-child(2n) { - border-right: 1px solid var(--stage-border); - } - - .hero-bottom div:last-child { - border-right: 0; - } - - .utility-strip__inner { - grid-template-columns: minmax(18rem, 0.7fr) minmax(0, 1.3fr); - gap: 2rem; - align-items: start; - } - - .utility-row { - grid-template-columns: minmax(8.5rem, 0.34fr) minmax(0, 1fr); - } - - .utility-row > :not(span) { + .utility-strip { + align-self: end; justify-self: end; - text-align: right; + width: min(100%, 22rem); } - .utility-row .appcast-download__body { + .utility-strip__items { + grid-template-columns: minmax(0, 1fr); justify-items: end; } - .utility-row .appcast-download__primary { - justify-content: flex-end; - text-align: right; - } - - .utility-row .reset-inline { - justify-content: flex-end; - } - - .utility-row--window a { - justify-items: end; + .utility-row { + width: 100%; } .system-panel { - grid-template-columns: minmax(18rem, 0.72fr) minmax(0, 1.28fr); - gap: 2rem; + grid-template-columns: minmax(15rem, 0.68fr) minmax(0, 1.32fr); + gap: 1rem; align-items: start; - padding: 1.15rem 0; + padding: 1rem 0 1rem 0.95rem; } .system-panel__lead { - position: sticky; - top: 1rem; + position: static; } - .system-loop li { - grid-template-columns: 2.65rem minmax(0, 1fr); - padding: 0.76rem 0; + .system-loop { + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 0.5rem; } - .system-loop li:first-child { - padding-top: 0; + .system-loop li { + grid-template-columns: 2rem minmax(0, 1fr); + padding: 0.58rem 0.68rem; } .radar-layout { - grid-template-columns: minmax(0, 1.45fr) minmax(19rem, 0.8fr); - gap: 1.15rem; + grid-template-columns: minmax(0, 0.9fr) minmax(28rem, 1.1fr); + gap: 1.1rem; } - .publisher-board { - grid-template-columns: minmax(0, 1fr) minmax(22rem, 0.72fr); - gap: 2rem; + .radar-stack { + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 0.72rem; + } + + .brief-list, + .watch-list { + align-content: start; + } + + .brief-list strong { + display: -webkit-box; + overflow: hidden; + -webkit-box-orient: vertical; + -webkit-line-clamp: 2; } - .publisher-flow span:first-child { - border-top: 0; + .publisher-board { + grid-template-columns: minmax(18rem, 0.9fr) minmax(0, 1.1fr); + gap: 1rem; + align-items: center; } .feed-toolbar { @@ -2022,7 +2066,7 @@ code { .signal-card { grid-template-columns: 9.5rem minmax(0, 1fr); gap: 1.4rem; - padding: 1.25rem 0 1.35rem; + padding: 1.25rem 1rem 1.35rem; } .signal-card__index { @@ -2050,7 +2094,7 @@ code { } .lead-brief { - padding: 1.6rem; + padding: 1.05rem; } } @@ -2109,10 +2153,6 @@ code { font-size: 2.1rem; } - .publisher-flow { - border-top: 1px solid var(--border); - } - .signal-source-list li { grid-template-columns: minmax(0, 1fr); gap: 0.2rem;