Commitba23fe2unknown_key

Design: strip cyberpunk aesthetic, adopt professional dark palette

Design: strip cyberpunk aesthetic, adopt professional dark palette

- Replace all hard-coded neon hex colors (#8c6dff, #36c5d6, etc.) and
  rgba purple/cyan values throughout landing.tsx with CSS design tokens
  (var(--accent), var(--border), var(--bg-elevated), etc.)
- Update dark mode background tokens in layout.tsx to GitHub-calibrated
  slate (#0d1117 base) — warmer, more trustworthy slate instead of
  near-black blue-tinted hues
- Remove animated blob drifts, dot-grid overlays, purple radial glow
  orbs, and neon box-shadow pulses from landing.tsx hero and sections
- Clean gradient text clips (land-2030-grad-*, .gradient-text) → solid
  var(--text-strong) or var(--accent) for legibility and professionalism
- Fix card/feature/walk-num hover states: remove purple glow box-shadows,
  replace with var(--border-strong) and var(--elev-2) tokens
- Wire migrationAssistantRoutes into app.tsx (was imported but never
  mounted — GET/POST /:owner/:repo/migrations/propose routes now active)

https://claude.ai/code/session_01W1Wr1gducAJ51tSHJuJ9tY

Claude committed on June 15, 2026Parent: 0685150

3 files changed+133−310ba23fe24e996a7e018766ff75318b49a64d0e22b

3 changed files+133−310

Modifiedsrc/app.tsx+2−0View fileUnified Split

@@ -80,6 +80,7 @@ import importBulkRoutes from "./routes/import-bulk";

8080import importSecretsRoutes from "./routes/import-secrets";

8181import actionsImporterRoutes from "./routes/actions-importer";

8282import migrationRoutes from "./routes/migrations";

83import migrationAssistantRoutes from "./routes/migration-assistant";

8384import migrateRoutes from "./routes/migrate";

8485import specsRoutes from "./routes/specs";

8586import refactorRoutes from "./routes/refactors";

@@ -715,6 +716,7 @@ app.route("/", importSecretsRoutes);

715716// GitHub Actions → Gluecron gates.yml importer (stateless converter)

716717app.route("/", actionsImporterRoutes);

717718app.route("/", migrationRoutes);

719app.route("/", migrationAssistantRoutes);

718720// GitHub Org Migration Wizard — live progress bulk importer

719721app.route("/", migrateRoutes);

720722

Modifiedsrc/views/landing.tsx+112−243View fileUnified Split

@@ -1276,14 +1276,14 @@ const ClosedLoopDiagram: FC = () => (

12761276 >

12771277 <defs>

12781278 <linearGradient id="land2030LoopLine" x1="0" y1="0" x2="1" y2="0">

1279 <stop offset="0%" stop-color="#8c6dff" stop-opacity="0.0" />

1280 <stop offset="20%" stop-color="#8c6dff" stop-opacity="0.6" />

1281 <stop offset="80%" stop-color="#36c5d6" stop-opacity="0.6" />

1282 <stop offset="100%" stop-color="#36c5d6" stop-opacity="0.0" />

1279 <stop offset="0%" stop-color="#5b6ee8" stop-opacity="0.0" />

1280 <stop offset="20%" stop-color="#5b6ee8" stop-opacity="0.5" />

1281 <stop offset="80%" stop-color="#5b6ee8" stop-opacity="0.5" />

1282 <stop offset="100%" stop-color="#5b6ee8" stop-opacity="0.0" />

12831283 </linearGradient>

12841284 <radialGradient id="land2030LoopNode" cx="0.5" cy="0.5" r="0.5">

1285 <stop offset="0%" stop-color="#a48bff" stop-opacity="0.95" />

1286 <stop offset="100%" stop-color="#36c5d6" stop-opacity="0.85" />

1285 <stop offset="0%" stop-color="#5b6ee8" stop-opacity="0.95" />

1286 <stop offset="100%" stop-color="#5b6ee8" stop-opacity="0.60" />

12871287 </radialGradient>

12881288 </defs>

12891289 {/* connecting curve */}

@@ -1689,44 +1689,31 @@ const landingCss = `

16891689 }

16901690 .hero-pr-card {

16911691 position: relative;

1692 background: linear-gradient(180deg, rgba(15,17,26,0.96) 0%, rgba(8,9,15,0.96) 100%);

1692 background: var(--bg-elevated);

16931693 border: 1px solid var(--border-strong);

16941694 border-radius: var(--r-xl);

16951695 overflow: hidden;

16961696 text-align: left;

1697 box-shadow:

1698 0 30px 80px -20px rgba(0,0,0,0.65),

1699 0 0 0 1px rgba(140,109,255,0.18),

1700 0 0 60px -10px rgba(140,109,255,0.30);

1697 box-shadow: 0 24px 64px -16px rgba(0,0,0,0.45), 0 0 0 1px var(--border-strong);

17011698 transform: rotateX(2deg) rotateY(-2deg);

17021699 transition: transform 600ms var(--ease, ease);

1703 backdrop-filter: blur(12px);

1704 -webkit-backdrop-filter: blur(12px);

17051700 }

17061701 .landing-hero-visual:hover .hero-pr-card {

17071702 transform: rotateX(0deg) rotateY(0deg);

17081703 }

1709 .hero-pr-card::before {

1710 content: '';

1711 position: absolute;

1712 inset: 0;

1713 background: linear-gradient(135deg, rgba(140,109,255,0.10), transparent 35%, transparent 65%, rgba(54,197,214,0.08));

1714 pointer-events: none;

1715 }

17161704 .hero-pr-header {

17171705 display: flex;

17181706 align-items: center;

17191707 gap: 12px;

17201708 padding: 14px 18px;

1721 border-bottom: 1px solid rgba(255,255,255,0.06);

1722 background: rgba(255,255,255,0.025);

1709 border-bottom: 1px solid var(--border);

1710 background: var(--bg-secondary);

17231711 font-size: 13px;

17241712 }

17251713 .hero-pr-dot {

17261714 width: 10px; height: 10px;

17271715 border-radius: 50%;

17281716 background: var(--green);

1729 box-shadow: 0 0 10px rgba(52,211,153,0.6);

17301717 flex-shrink: 0;

17311718 }

17321719 .hero-pr-title {

@@ -1750,7 +1737,7 @@ const landingCss = `

17501737 padding: 3px 10px;

17511738 border-radius: var(--r-full);

17521739 background: var(--accent-gradient-faint);

1753 border: 1px solid rgba(140,109,255,0.30);

1740 border: 1px solid var(--border);

17541741 color: var(--accent);

17551742 font-family: var(--font-mono);

17561743 font-size: 11px;

@@ -1761,13 +1748,7 @@ const landingCss = `

17611748 width: 6px; height: 6px;

17621749 border-radius: 50%;

17631750 background: var(--accent);

1764 box-shadow: 0 0 0 0 rgba(140,109,255,0.6);

1765 animation: hero-pulse 1.6s ease-out infinite;

1766 }

1767 @keyframes hero-pulse {

1768 0% { box-shadow: 0 0 0 0 rgba(140,109,255,0.55); }

1769 70% { box-shadow: 0 0 0 8px rgba(140,109,255,0); }

1770 100% { box-shadow: 0 0 0 0 rgba(140,109,255,0); }

1751 animation: heroPulse 2s ease-in-out infinite;

17711752 }

17721753

17731754 .hero-pr-body {

@@ -1799,8 +1780,8 @@ const landingCss = `

17991780 overflow-x: auto;

18001781 }

18011782 .hero-pr-hunk {

1802 color: rgba(140,109,255,0.85);

1803 background: rgba(140,109,255,0.06);

1783 color: var(--accent);

1784 background: var(--accent-gradient-faint);

18041785 padding: 2px 8px;

18051786 margin: 0 -8px 4px;

18061787 border-radius: 4px;

@@ -1817,8 +1798,8 @@ const landingCss = `

18171798 .hero-pr-comment {

18181799 margin: 14px 18px;

18191800 padding: 14px 16px;

1820 background: linear-gradient(135deg, rgba(140,109,255,0.08), rgba(54,197,214,0.05));

1821 border: 1px solid rgba(140,109,255,0.25);

1801 background: var(--bg-secondary);

1802 border: 1px solid var(--border);

18221803 border-radius: var(--r-md);

18231804 }

18241805 .hero-pr-bot-row {

@@ -1836,7 +1817,6 @@ const landingCss = `

18361817 border-radius: 50%;

18371818 background: var(--accent-gradient);

18381819 font-size: 11px;

1839 box-shadow: 0 0 12px rgba(140,109,255,0.40);

18401820 }

18411821 .hero-pr-bot-name {

18421822 color: var(--text-strong);

@@ -1888,11 +1868,11 @@ const landingCss = `

18881868 .hero-pr-gate-running {

18891869 color: var(--accent);

18901870 background: var(--accent-gradient-faint);

1891 border-color: rgba(140,109,255,0.40);

1871 border-color: var(--border-strong);

18921872 }

18931873 .hero-pr-gate-spin {

18941874 width: 9px; height: 9px;

1895 border: 1.5px solid rgba(140,109,255,0.30);

1875 border: 1.5px solid var(--border);

18961876 border-top-color: var(--accent);

18971877 border-radius: 50%;

18981878 animation: hero-spin 800ms linear infinite;

@@ -1908,13 +1888,13 @@ const landingCss = `

19081888 align-items: center;

19091889 gap: 6px;

19101890 padding: 6px 12px;

1911 background: rgba(15,17,26,0.92);

1912 border: 1px solid rgba(140,109,255,0.35);

1891 background: var(--bg-elevated);

1892 border: 1px solid var(--border-strong);

19131893 border-radius: var(--r-full);

19141894 font-family: var(--font-mono);

19151895 font-size: 11px;

19161896 color: var(--text);

1917 box-shadow: 0 12px 24px -8px rgba(0,0,0,0.5), 0 0 18px -4px rgba(140,109,255,0.30);

1897 box-shadow: var(--elev-2);

19181898 backdrop-filter: blur(8px);

19191899 -webkit-backdrop-filter: blur(8px);

19201900 }

@@ -1945,91 +1925,31 @@ const landingCss = `

19451925 .hero-pr-diff { font-size: 11px; line-height: 1.6; }

19461926 .hero-float { display: none; }

19471927 }

1928 /* Hero background — single restrained radial glow, no blobs or grids.

1929 Professional tools (GitHub, Linear, Stripe) use clean backgrounds. */

19481930 .landing-hero-bg {

19491931 position: absolute;

1950 inset: -10% -20%;

1932 inset: 0;

19511933 pointer-events: none;

19521934 z-index: 0;

19531935 }

1954 .landing-hero-blob {

1955 position: absolute;

1956 border-radius: 50%;

1957 filter: blur(80px);

1958 opacity: 0.55;

1959 will-change: transform;

1960 }

1961 .landing-hero-blob-1 {

1962 top: -10%;

1963 left: 30%;

1964 width: 480px;

1965 height: 480px;

1966 background: radial-gradient(circle, rgba(140,109,255,0.65), transparent 65%);

1967 /* 2026 polish — slow drift gives the hero "this is a live product"

1968 feel without being distracting. 24s loop, eased, contained motion. */

1969 animation: landingBlobDrift1 24s ease-in-out infinite;

1970 }

1971 .landing-hero-blob-2 {

1972 top: 10%;

1973 left: 50%;

1974 width: 380px;

1975 height: 380px;

1976 background: radial-gradient(circle, rgba(54,197,214,0.50), transparent 65%);

1977 animation: landingBlobDrift2 28s ease-in-out infinite;

1978 }

1979 /* U1 — subtle, low-opacity accent-gradient orb behind the headline.

1980 Sits dead-centre, very blurred, so the hero reads as a real product

1981 surface rather than flat-bg + text. 2026 polish — gentle breathing

1982 pulse to give the surface a soft heartbeat. */

1936 .landing-hero-blob { display: none; }

1937 .landing-hero-blob-1 { display: none; }

1938 .landing-hero-blob-2 { display: none; }

19831939 .landing-hero-orb {

1984 top: 18%;

1940 position: absolute;

1941 top: -20%;

19851942 left: 50%;

19861943 transform: translateX(-50%);

1987 width: 720px;

1988 height: 720px;

1989 background: radial-gradient(circle, rgba(140,109,255,0.28), rgba(54,197,214,0.16) 45%, transparent 70%);

1990 filter: blur(120px);

1991 opacity: 0.6;

1992 z-index: 0;

1993 animation: landingOrbBreath 12s ease-in-out infinite;

1944 width: 900px;

1945 height: 500px;

1946 background: radial-gradient(ellipse at center, rgba(91,110,232,0.08) 0%, transparent 70%);

1947 pointer-events: none;

19941948 }

19951949 :root[data-theme='light'] .landing-hero-orb {

1996 opacity: 0.32;

1997 }

1998 @keyframes landingBlobDrift1 {

1999 0%, 100% { transform: translate(0, 0) scale(1); }

2000 33% { transform: translate(40px, -30px) scale(1.08); }

2001 66% { transform: translate(-30px, 25px) scale(0.95); }

2002 }

2003 @keyframes landingBlobDrift2 {

2004 0%, 100% { transform: translate(0, 0) scale(1); }

2005 50% { transform: translate(-50px, 35px) scale(1.12); }

2006 }

2007 @keyframes landingOrbBreath {

2008 0%, 100% { opacity: 0.55; transform: translateX(-50%) scale(1); }

2009 50% { opacity: 0.72; transform: translateX(-50%) scale(1.06); }

2010 }

2011 @media (prefers-reduced-motion: reduce) {

2012 .landing-hero-blob-1,

2013 .landing-hero-blob-2,

2014 .landing-hero-orb {

2015 animation: none;

2016 }

2017 }

2018 .landing-hero-grid {

2019 position: absolute;

2020 inset: 0;

2021 background-image:

2022 linear-gradient(to right, rgba(255,255,255,0.04) 1px, transparent 1px),

2023 linear-gradient(to bottom, rgba(255,255,255,0.04) 1px, transparent 1px);

2024 background-size: 60px 60px;

2025 mask-image: radial-gradient(ellipse 50% 50% at 50% 30%, #000 0%, transparent 75%);

2026 -webkit-mask-image: radial-gradient(ellipse 50% 50% at 50% 30%, #000 0%, transparent 75%);

2027 }

2028 :root[data-theme='light'] .landing-hero-grid {

2029 background-image:

2030 linear-gradient(to right, rgba(15,16,28,0.06) 1px, transparent 1px),

2031 linear-gradient(to bottom, rgba(15,16,28,0.06) 1px, transparent 1px);

1950 background: radial-gradient(ellipse at center, rgba(67,83,201,0.05) 0%, transparent 70%);

20321951 }

1952 .landing-hero-grid { display: none; }

20331953

20341954 .landing-hero-inner {

20351955 position: relative;

@@ -2047,15 +1967,13 @@ const landingCss = `

20471967 width: 7px;

20481968 height: 7px;

20491969 border-radius: 50%;

2050 background: var(--accent);

2051 box-shadow: 0 0 0 0 rgba(140,109,255,0.6);

2052 animation: pulse 1.8s ease-out infinite;

1970 background: var(--green);

20531971 flex-shrink: 0;

1972 animation: heroPulse 2.4s ease-in-out infinite;

20541973 }

2055 @keyframes pulse {

2056 0% { box-shadow: 0 0 0 0 rgba(140,109,255,0.55); }

2057 70% { box-shadow: 0 0 0 10px rgba(140,109,255,0); }

2058 100% { box-shadow: 0 0 0 0 rgba(140,109,255,0); }

1974 @keyframes heroPulse {

1975 0%, 100% { opacity: 1; }

1976 50% { opacity: 0.45; }

20591977 }

20601978

20611979 .landing-hero-title {

@@ -2071,14 +1989,14 @@ const landingCss = `

20711989 color: var(--text-strong);

20721990 }

20731991 .landing-hero-title .gradient-text {

2074 /* Richer gradient with a third stop for more depth. Drop-shadow

2075 gives the impression of subtle glow without overpowering the type. */

2076 background-image: linear-gradient(135deg, #c2a8ff 0%, #8c6dff 40%, #5d3dff 70%, #36c5d6 100%);

1992 background-image: linear-gradient(135deg, var(--text-strong) 0%, var(--accent) 100%);

20771993 -webkit-background-clip: text;

20781994 background-clip: text;

20791995 -webkit-text-fill-color: transparent;

20801996 color: transparent;

2081 filter: drop-shadow(0 4px 32px rgba(140, 109, 255, 0.18));

1997 }

1998 :root[data-theme='light'] .landing-hero-title .gradient-text {

1999 background-image: linear-gradient(135deg, #0e1020 0%, #4353c9 100%);

20822000 }

20832001

20842002 .landing-hero-sub {

@@ -2154,7 +2072,7 @@ const landingCss = `

21542072 border: 1px solid transparent;

21552073 background-image:

21562074 linear-gradient(var(--bg-elevated), var(--bg-elevated)),

2157 linear-gradient(90deg, #8c6dff 0%, #36c5d6 100%);

2075 linear-gradient(var(--border-strong), var(--border-strong));

21582076 background-origin: border-box;

21592077 background-clip: padding-box, border-box;

21602078 transition: transform var(--t-base, 180ms) var(--ease-spring, ease),

@@ -2162,7 +2080,7 @@ const landingCss = `

21622080 }

21632081 .landing-cta-dxt:hover {

21642082 transform: translateY(-2px);

2165 box-shadow: 0 8px 24px -8px rgba(140, 109, 255, 0.45);

2083 box-shadow: var(--elev-2);

21662084 }

21672085 @media (prefers-reduced-motion: reduce) {

21682086 .landing-cta-dxt,

@@ -2185,9 +2103,9 @@ const landingCss = `

21852103 box-shadow var(--t-base, 180ms) var(--ease, ease);

21862104 }

21872105 .landing-cta-migrate:hover {

2188 border-color: rgba(140,109,255,0.55);

2106 border-color: var(--border-strong);

21892107 transform: translateY(-2px);

2190 box-shadow: 0 8px 22px -8px rgba(140,109,255,0.30);

2108 box-shadow: var(--elev-2);

21912109 text-decoration: none;

21922110 color: var(--text-strong);

21932111 }

@@ -2211,7 +2129,7 @@ const landingCss = `

22112129 color: var(--accent);

22122130 text-decoration: none;

22132131 font-weight: 500;

2214 border-bottom: 1px dotted rgba(140,109,255,0.4);

2132 border-bottom: 1px dotted var(--border);

22152133 transition: color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease);

22162134 }

22172135 .landing-hero-freenote-link:hover {

@@ -2368,7 +2286,7 @@ const landingCss = `

23682286 content: '';

23692287 position: absolute;

23702288 inset: 0;

2371 background: radial-gradient(120% 100% at 0% 0%, rgba(140,109,255,0.08), transparent 55%);

2289 background: var(--bg-surface);

23722290 opacity: 0;

23732291 transition: opacity var(--t-base) var(--ease);

23742292 z-index: -1;

@@ -2389,7 +2307,7 @@ const landingCss = `

23892307 background: var(--accent-gradient-soft);

23902308 color: var(--accent);

23912309 margin-bottom: var(--s-4);

2392 border: 1px solid rgba(140,109,255,0.20);

2310 border: 1px solid var(--border);

23932311 }

23942312 .landing-feature-title {

23952313 font-family: var(--font-display);

@@ -2436,7 +2354,7 @@ const landingCss = `

24362354 font-size: 11px;

24372355 color: var(--accent);

24382356 background: var(--accent-gradient-faint);

2439 border: 1px solid rgba(140,109,255,0.30);

2357 border: 1px solid var(--border);

24402358 padding: 3px 8px;

24412359 border-radius: var(--r-full);

24422360 letter-spacing: 0.06em;

@@ -2470,7 +2388,7 @@ const landingCss = `

24702388 border: 1px solid var(--border-strong);

24712389 border-radius: var(--r-lg);

24722390 overflow: hidden;

2473 box-shadow: var(--elev-3), 0 0 60px -10px rgba(140,109,255,0.18);

2391 box-shadow: var(--elev-3);

24742392 text-align: left;

24752393 }

24762394 :root[data-theme='light'] .landing-terminal {

@@ -2518,7 +2436,7 @@ const landingCss = `

25182436 word-break: break-all;

25192437 }

25202438 .landing-term-out { color: rgba(237,237,242,0.7); }

2521 .landing-term-prompt { color: rgba(140,109,255,0.85); user-select: none; flex-shrink: 0; }

2439 .landing-term-prompt { color: var(--accent); user-select: none; flex-shrink: 0; }

25222440 .landing-term-meta { color: rgba(237,237,242,0.45); }

25232441 .landing-term-ok { color: var(--green); user-select: none; flex-shrink: 0; }

25242442 .landing-term-ok-line { color: rgba(237,237,242,0.92); }

@@ -2607,13 +2525,11 @@ const landingCss = `

26072525 transform: translateY(-2px);

26082526 }

26092527 .landing-price-hl {

2610 border-color: rgba(140,109,255,0.35);

2611 box-shadow: var(--elev-2), 0 0 0 1px rgba(140,109,255,0.25);

2612 background:

2613 linear-gradient(180deg, rgba(140,109,255,0.05), transparent 50%),

2614 var(--bg-elevated);

2528 border-color: var(--border-strong);

2529 box-shadow: var(--elev-2);

2530 background: var(--bg-elevated);

26152531 }

2616 .landing-price-hl:hover { border-color: rgba(140,109,255,0.55); }

2532 .landing-price-hl:hover { border-color: var(--accent); }

26172533 .landing-price-badge {

26182534 position: absolute;

26192535 top: -10px;

@@ -2628,7 +2544,7 @@ const landingCss = `

26282544 text-transform: uppercase;

26292545 font-weight: 600;

26302546 border-radius: var(--r-full);

2631 box-shadow: 0 4px 12px -2px rgba(140,109,255,0.4);

2547 box-shadow: var(--elev-1);

26322548 }

26332549 .landing-price-tier {

26342550 font-family: var(--font-mono);

@@ -2697,23 +2613,7 @@ const landingCss = `

26972613 position: absolute;

26982614 inset: 0;

26992615 z-index: -1;

2700 background:

2701 radial-gradient(60% 100% at 50% 0%, rgba(140,109,255,0.16), transparent 65%),

2702 radial-gradient(40% 80% at 80% 100%, rgba(54,197,214,0.10), transparent 65%);

2703 }

2704 .landing-cta-card::after {

2705 content: '';

2706 position: absolute;

2707 inset: 0;

2708 z-index: -1;

2709 background-image: radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px);

2710 background-size: 24px 24px;

2711 mask-image: radial-gradient(ellipse at center, #000 0%, transparent 65%);

2712 -webkit-mask-image: radial-gradient(ellipse at center, #000 0%, transparent 65%);

2713 opacity: 0.6;

2714 }

2715 :root[data-theme='light'] .landing-cta-card::after {

2716 background-image: radial-gradient(rgba(15,16,28,0.07) 1px, transparent 1px);

2616 background: radial-gradient(60% 80% at 50% 0%, rgba(91,110,232,0.07), transparent 70%);

27172617 }

27182618 .landing-cta-card .eyebrow { justify-content: center; }

27192619 .landing-cta-title {

@@ -2782,11 +2682,7 @@ const landingCss = `

27822682 font-weight: 700;

27832683 margin-bottom: 6px;

27842684 font-feature-settings: 'tnum';

2785 background-image: var(--accent-gradient);

2786 -webkit-background-clip: text;

2787 background-clip: text;

2788 -webkit-text-fill-color: transparent;

2789 color: transparent;

2685 color: var(--text-strong);

27902686 }

27912687 .landing-counter-label {

27922688 font-family: var(--font-mono);

@@ -2954,7 +2850,7 @@ const landingCss = `

29542850 border-radius: var(--r);

29552851 background: var(--accent-gradient-soft);

29562852 color: var(--accent);

2957 border: 1px solid rgba(140,109,255,0.20);

2853 border: 1px solid var(--border);

29582854 }

29592855 .landing-reason-title {

29602856 font-family: var(--font-display);

@@ -3007,9 +2903,7 @@ const landingCss = `

30072903 .landing-pullquote {

30082904 margin: 0;

30092905 padding: var(--s-10) var(--s-7);

3010 background:

3011 radial-gradient(80% 100% at 50% 0%, rgba(140,109,255,0.10), transparent 65%),

3012 var(--bg-elevated);

2906 background: var(--bg-elevated);

30132907 border: 1px solid var(--border-strong);

30142908 border-radius: var(--r-xl);

30152909 position: relative;

@@ -3086,13 +2980,7 @@ const landingCss = `

30862980 width: 8px; height: 8px;

30872981 border-radius: 50%;

30882982 background: var(--green);

3089 box-shadow: 0 0 0 0 rgba(52,211,153,0.6);

3090 animation: landing-livenow-pulse 1.6s ease-out infinite;

3091 }

3092 @keyframes landing-livenow-pulse {

3093 0% { box-shadow: 0 0 0 0 rgba(52,211,153,0.55); transform: scale(1); }

3094 70% { box-shadow: 0 0 0 10px rgba(52,211,153,0); transform: scale(1.05); }

3095 100% { box-shadow: 0 0 0 0 rgba(52,211,153,0); transform: scale(1); }

2983 animation: heroPulse 2.4s ease-in-out infinite;

30962984 }

30972985 .landing-livenow-title {

30982986 font-size: 22px;

@@ -3161,8 +3049,7 @@ const landingCss = `

31613049 width: 7px; height: 7px;

31623050 border-radius: 50%;

31633051 background: var(--green);

3164 box-shadow: 0 0 8px rgba(52,211,153,0.55);

3165 animation: landing-livenow-pulse 1.8s ease-out infinite;

3052 animation: heroPulse 2.4s ease-in-out infinite;

31663053 flex-shrink: 0;

31673054 }

31683055 .landing-livecard-title {

@@ -3185,11 +3072,6 @@ const landingCss = `

31853072 font-weight: 700;

31863073 color: var(--text-strong);

31873074 font-variant-numeric: tabular-nums;

3188 background: var(--accent-gradient);

3189 -webkit-background-clip: text;

3190 background-clip: text;

3191 -webkit-text-fill-color: transparent;

3192 color: transparent;

31933075 }

31943076 .landing-livecard-bignum-label {

31953077 font-size: 12px;

@@ -3284,15 +3166,15 @@ const landingCss = `

32843166 }

32853167 .landing-livecard-kind-ai_build-dispatched,

32863168 .landing-livecard-kind-ai-build-dispatched {

3287 background: rgba(140,109,255,0.12);

3169 background: var(--accent-gradient-faint);

32883170 color: var(--accent);

3289 border: 1px solid rgba(140,109,255,0.30);

3171 border: 1px solid var(--border-strong);

32903172 }

32913173 .landing-livecard-kind-ai_review-posted,

32923174 .landing-livecard-kind-ai-review-posted {

3293 background: rgba(54,197,214,0.12);

3175 background: var(--bg-surface);

32943176 color: var(--accent-2);

3295 border: 1px solid rgba(54,197,214,0.30);

3177 border: 1px solid var(--border);

32963178 }

32973179

32983180 .landing-livenow-cta {

@@ -3451,9 +3333,8 @@ const land2030Css = `

34513333 .land-2030-hairline {

34523334 position: absolute;

34533335 top: 0; left: 0; right: 0;

3454 height: 2px;

3455 background: linear-gradient(90deg, transparent 0%, #8c6dff 30%, #36c5d6 70%, transparent 100%);

3456 opacity: 0.75;

3336 height: 1px;

3337 background: var(--border);

34573338 pointer-events: none;

34583339 }

34593340 .land-2030-orb {

@@ -3461,10 +3342,9 @@ const land2030Css = `

34613342 top: -10%;

34623343 left: 50%;

34633344 width: 720px;

3464 height: 720px;

3345 height: 480px;

34653346 transform: translateX(-50%);

3466 background: radial-gradient(circle, rgba(140,109,255,0.30), rgba(54,197,214,0.16) 40%, transparent 70%);

3467 filter: blur(90px);

3347 background: radial-gradient(ellipse, rgba(91,110,232,0.07), transparent 70%);

34683348 pointer-events: none;

34693349 z-index: 0;

34703350 }

@@ -3480,12 +3360,12 @@ const land2030Css = `

34803360 gap: 8px;

34813361 padding: 6px 12px;

34823362 border-radius: 999px;

3483 background: rgba(140,109,255,0.10);

3484 color: #cbb7ff;

3363 background: var(--bg-surface);

3364 color: var(--accent);

34853365 font-size: 12px;

34863366 letter-spacing: 0.04em;

34873367 text-transform: uppercase;

3488 border: 1px solid rgba(140,109,255,0.30);

3368 border: 1px solid var(--border);

34893369 margin-bottom: 24px;

34903370 }

34913371 .land-2030-eyebrow-mini {

@@ -3494,8 +3374,7 @@ const land2030Css = `

34943374 .land-2030-pulse {

34953375 width: 8px; height: 8px;

34963376 border-radius: 50%;

3497 background: #8c6dff;

3498 box-shadow: 0 0 12px rgba(140,109,255,0.8);

3377 background: var(--accent);

34993378 animation: land2030-pulse 2s ease-in-out infinite;

35003379 }

35013380 @keyframes land2030-pulse {

@@ -3511,12 +3390,7 @@ const land2030Css = `

35113390 margin: 0 auto 24px;

35123391 max-width: 1040px;

35133392 }

3514 .land-2030-display span { background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }

3515 .land-2030-grad-1 { background-image: linear-gradient(135deg, #a48bff 0%, #8c6dff 100%); }

3516 .land-2030-grad-2 { background-image: linear-gradient(135deg, #c4b1ff 0%, #36c5d6 100%); }

3517 .land-2030-grad-3 { background-image: linear-gradient(135deg, #36c5d6 0%, #5be0a9 100%); }

3518 .land-2030-grad-4 { background-image: linear-gradient(135deg, #5be0a9 0%, #ffd16b 100%); }

3519 .land-2030-grad-5 { background-image: linear-gradient(135deg, #ffd16b 0%, #ff6bd1 50%, #8c6dff 100%); }

3393 .land-2030-display span { color: var(--accent); }

35203394 .land-2030-sub {

35213395 font-size: clamp(17px, 1.6vw, 22px);

35223396 color: var(--text-muted, #a0a0b8);

@@ -3542,8 +3416,8 @@ const land2030Css = `

35423416 }

35433417 .land-2030-section-dark {

35443418 padding: 48px 32px;

3545 background: linear-gradient(180deg, rgba(15,17,26,0.6), rgba(8,9,15,0.6));

3546 border: 1px solid rgba(140,109,255,0.18);

3419 background: var(--bg-elevated);

3420 border: 1px solid var(--border);

35473421 border-radius: 20px;

35483422 }

35493423 .land-2030-section-head {

@@ -3571,8 +3445,8 @@ const land2030Css = `

35713445 max-width: 1100px;

35723446 margin: 0 auto;

35733447 padding: 16px;

3574 background: rgba(255,255,255,0.02);

3575 border: 1px solid rgba(140,109,255,0.16);

3448 background: var(--bg-elevated);

3449 border: 1px solid var(--border);

35763450 border-radius: 20px;

35773451 color: var(--text-muted, #a0a0b8);

35783452 }

@@ -3608,17 +3482,16 @@ const land2030Css = `

36083482 flex-direction: column;

36093483 gap: 10px;

36103484 padding: 24px;

3611 background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.015));

3612 border: 1px solid rgba(255,255,255,0.08);

3485 background: var(--bg-elevated);

3486 border: 1px solid var(--border);

36133487 border-radius: 16px;

36143488 text-decoration: none;

36153489 color: inherit;

3616 transition: transform 200ms ease, border-color 200ms ease, box-shadow 200ms ease;

3490 transition: transform 200ms ease, border-color 200ms ease;

36173491 }

36183492 .land-2030-card:hover {

36193493 transform: translateY(-2px);

3620 border-color: rgba(140,109,255,0.45);

3621 box-shadow: 0 8px 30px -8px rgba(140,109,255,0.40);

3494 border-color: var(--border-strong);

36223495 }

36233496 .land-2030-card-icon {

36243497 width: 44px; height: 44px;

@@ -3626,9 +3499,9 @@ const land2030Css = `

36263499 align-items: center;

36273500 justify-content: center;

36283501 border-radius: 12px;

3629 background: rgba(140,109,255,0.12);

3630 color: #cbb7ff;

3631 border: 1px solid rgba(140,109,255,0.30);

3502 background: var(--bg-surface);

3503 color: var(--accent);

3504 border: 1px solid var(--border);

36323505 margin-bottom: 4px;

36333506 }

36343507 .land-2030-card-title {

@@ -3645,7 +3518,7 @@ const land2030Css = `

36453518 }

36463519 .land-2030-card-cta {

36473520 margin-top: auto;

3648 color: #b69dff;

3521 color: var(--accent);

36493522 font-size: 14px;

36503523 font-weight: 600;

36513524 }

@@ -3663,8 +3536,8 @@ const land2030Css = `

36633536 flex-direction: column;

36643537 gap: 6px;

36653538 padding: 16px 18px;

3666 background: rgba(255,255,255,0.03);

3667 border: 1px solid rgba(255,255,255,0.08);

3539 background: var(--bg-elevated);

3540 border: 1px solid var(--border);

36683541 border-radius: 12px;

36693542 text-decoration: none;

36703543 color: inherit;

@@ -3672,12 +3545,12 @@ const land2030Css = `

36723545 }

36733546 .land-2030-dash:hover {

36743547 transform: translateY(-1px);

3675 border-color: rgba(54,197,214,0.45);

3548 border-color: var(--border-strong);

36763549 }

36773550 .land-2030-dash-name {

36783551 font-family: var(--font-mono, ui-monospace, monospace);

36793552 font-size: 14px;

3680 color: #36c5d6;

3553 color: var(--accent);

36813554 font-weight: 600;

36823555 }

36833556 .land-2030-dash-desc {

@@ -3699,16 +3572,16 @@ const land2030Css = `

36993572 flex-direction: column;

37003573 gap: 6px;

37013574 padding: 14px 16px;

3702 background: rgba(255,255,255,0.025);

3703 border: 1px solid rgba(255,255,255,0.07);

3575 background: var(--bg-elevated);

3576 border: 1px solid var(--border);

37043577 border-radius: 10px;

37053578 text-decoration: none;

37063579 color: inherit;

37073580 transition: border-color 160ms ease, background 160ms ease;

37083581 }

37093582 .land-2030-feat:hover {

3710 border-color: rgba(140,109,255,0.35);

3711 background: rgba(140,109,255,0.05);

3583 border-color: var(--border-strong);

3584 background: var(--bg-surface);

37123585 }

37133586 .land-2030-feat-head {

37143587 display: flex;

@@ -3751,8 +3624,8 @@ const land2030Css = `

37513624 }

37523625 .land-2030-dx {

37533626 padding: 18px;

3754 background: linear-gradient(180deg, rgba(15,17,26,0.7), rgba(8,9,15,0.7));

3755 border: 1px solid rgba(140,109,255,0.18);

3627 background: var(--bg-elevated);

3628 border: 1px solid var(--border);

37563629 border-radius: 14px;

37573630 }

37583631 .land-2030-dx-title {

@@ -3764,19 +3637,19 @@ const land2030Css = `

37643637 .land-2030-code {

37653638 margin: 0;

37663639 padding: 12px 14px;

3767 background: rgba(0,0,0,0.30);

3768 border: 1px solid rgba(255,255,255,0.06);

3640 background: var(--bg);

3641 border: 1px solid var(--border);

37693642 border-radius: 10px;

37703643 font-family: var(--font-mono, ui-monospace, monospace);

37713644 font-size: 12.5px;

3772 color: #cbb7ff;

3645 color: var(--text-muted);

37733646 line-height: 1.6;

37743647 overflow-x: auto;

37753648 }

37763649 .land-2030-code code { color: inherit; background: transparent; padding: 0; }

37773650 .land-2030-code-wide {

37783651 font-size: 13px;

3779 color: #d6d6e4;

3652 color: var(--text);

37803653 }

37813654

37823655 /* ---------- Agent multiplayer ---------- */

@@ -3793,11 +3666,7 @@ const land2030Css = `

37933666 font-size: clamp(48px, 7vw, 80px);

37943667 font-weight: 800;

37953668 line-height: 1;

3796 background-image: linear-gradient(135deg, #a48bff 0%, #36c5d6 100%);

3797 background-clip: text;

3798 -webkit-background-clip: text;

3799 -webkit-text-fill-color: transparent;

3800 color: transparent;

3669 color: var(--text-strong);

38013670 letter-spacing: -0.03em;

38023671 }

38033672 .land-2030-agent-label {

@@ -3809,7 +3678,7 @@ const land2030Css = `

38093678 .land-2030-agent-link {

38103679 display: inline-block;

38113680 margin-top: 16px;

3812 color: #36c5d6;

3681 color: var(--accent);

38133682 text-decoration: none;

38143683 font-weight: 600;

38153684 font-size: 14px;

@@ -3820,8 +3689,8 @@ const land2030Css = `

38203689 .land-2030-vs {

38213690 max-width: 880px;

38223691 margin: 0 auto;

3823 background: rgba(255,255,255,0.03);

3824 border: 1px solid rgba(255,255,255,0.08);

3692 background: var(--bg-elevated);

3693 border: 1px solid var(--border);

38253694 border-radius: 14px;

38263695 overflow: hidden;

38273696 text-align: center;

@@ -3832,7 +3701,7 @@ const land2030Css = `

38323701 grid-template-columns: 1fr 1fr;

38333702 gap: 0;

38343703 padding: 16px 18px;

3835 border-bottom: 1px solid rgba(255,255,255,0.06);

3704 border-bottom: 1px solid var(--border);

38363705 font-size: 15px;

38373706 }

38383707 .land-2030-vs-row:last-of-type { border-bottom: 0; }

@@ -3841,16 +3710,16 @@ const land2030Css = `

38413710 letter-spacing: 0.04em;

38423711 text-transform: uppercase;

38433712 color: var(--text-muted, #a0a0b8);

3844 background: rgba(255,255,255,0.02);

3713 background: var(--bg-surface);

38453714 }

38463715 .land-2030-vs-us {

3847 color: #5be0a9;

3716 color: var(--text-strong);

38483717 font-weight: 700;

38493718 }

38503719 .land-2030-vs-link {

38513720 display: inline-block;

38523721 margin-top: 12px;

3853 color: #b69dff;

3722 color: var(--accent);

38543723 text-decoration: none;

38553724 font-weight: 600;

38563725 font-size: 14px;

Modifiedsrc/views/layout.tsx+19−67View fileUnified Split

@@ -1066,15 +1066,15 @@ const css = `

10661066 * defined as calm aliases so scattered users keep working.

10671067 * ============================================================== */

10681068 :root, :root[data-theme='dark'] {

1069 /* Surfaces — slate, not black. More depth, less crush. */

1070 --bg: #08090f;

1071 --bg-secondary: #0c0d14;

1072 --bg-tertiary: #11131c;

1073 --bg-elevated: #0f111a;

1074 --bg-surface: #161826;

1075 --bg-hover: rgba(255,255,255,0.04);

1076 --bg-active: rgba(255,255,255,0.08);

1077 --bg-inset: rgba(0,0,0,0.30);

1069 /* Surfaces — GitHub-calibrated slate. Readable, warm, never black-void. */

1070 --bg: #0d1117;

1071 --bg-secondary: #161b22;

1072 --bg-tertiary: #1c2128;

1073 --bg-elevated: #161b22;

1074 --bg-surface: #21262d;

1075 --bg-hover: rgba(255,255,255,0.05);

1076 --bg-active: rgba(255,255,255,0.09);

1077 --bg-inset: rgba(0,0,0,0.25);

10781078

10791079 /* Borders — three weights, used deliberately */

10801080 --border: rgba(255,255,255,0.06);

@@ -1302,35 +1302,8 @@ const css = `

13021302 border-radius: 3px;

13031303 }

13041304

1305 /* Whole-page atmosphere: very subtle gradient + dot-grid layered behind everything.

1306 Keeps every page feeling like part of the same product without competing with hero art. */

1307 body::before {

1308 content: '';

1309 position: fixed;

1310 inset: 0;

1311 pointer-events: none;

1312 z-index: -2;

1313 background:

1314 radial-gradient(70% 55% at 85% -20%, rgba(91,110,232,0.04), transparent 65%);

1315 }

1316 body::after {

1317 content: '';

1318 position: fixed;

1319 inset: 0;

1320 pointer-events: none;

1321 z-index: -1;

1322 background-image: radial-gradient(rgba(255,255,255,0.025) 1px, transparent 1px);

1323 background-size: 28px 28px;

1324 background-position: 0 0;

1325 opacity: 0.55;

1326 mask-image: radial-gradient(ellipse at 50% 0%, #000 0%, transparent 70%);

1327 -webkit-mask-image: radial-gradient(ellipse at 50% 0%, #000 0%, transparent 70%);

1328 }

1329 :root[data-theme='light'] body::before { opacity: 0.55; }

1330 :root[data-theme='light'] body::after {

1331 background-image: radial-gradient(rgba(15,16,28,0.06) 1px, transparent 1px);

1332 opacity: 0.4;

1333 }

1305 /* No full-page atmosphere overlay — clean backgrounds signal trustworthy

1306 infrastructure. Effects live on pages that earn them (landing hero only). */

13341307

13351308 a { color: var(--text-link); text-decoration: none; transition: color var(--t-fast) var(--ease); }

13361309 a:hover { color: var(--accent-hover); text-decoration: none; }

@@ -1510,11 +1483,11 @@ const css = `

15101483 border-bottom: 1px solid var(--border);

15111484 padding: 0 24px;

15121485 height: var(--header-h);

1513 background: rgba(8,9,15,0.72);

1514 backdrop-filter: saturate(180%) blur(18px);

1515 -webkit-backdrop-filter: saturate(180%) blur(18px);

1486 background: rgba(13,17,23,0.80);

1487 backdrop-filter: saturate(160%) blur(16px);

1488 -webkit-backdrop-filter: saturate(160%) blur(16px);

15161489 }

1517 :root[data-theme='light'] .site-header { background: rgba(251,251,252,0.78); }

1490 :root[data-theme='light'] .site-header { background: rgba(251,251,252,0.85); }

15181491

15191492 .site-header nav {

15201493 display: flex;

@@ -1906,9 +1879,7 @@ const css = `

19061879 padding: 56px 24px 40px;

19071880 color: var(--text-muted);

19081881 font-size: var(--t-sm);

1909 background:

1910 linear-gradient(180deg, transparent 0%, rgba(91,110,232,0.025) 100%),

1911 var(--bg);

1882 background: var(--bg);

19121883 }

19131884 footer .footer-inner {

19141885 max-width: 1920px;

@@ -2757,31 +2728,12 @@ const css = `

27572728 /* ============================================================ */

27582729 .empty-state {

27592730 text-align: center;

2760 padding: 96px 24px;

2731 padding: 80px 24px;

27612732 color: var(--text-muted);

2762 border: 1px dashed var(--border);

2733 border: 1px solid var(--border);

27632734 border-radius: var(--r-lg);

2764 background:

2765 radial-gradient(60% 60% at 50% 0%, rgba(91,110,232,0.05), transparent 70%),

2766 var(--bg-elevated);

2767 position: relative;

2768 overflow: hidden;

2769 }

2770 .empty-state::before {

2771 content: '';

2772 position: absolute;

2773 inset: 0;

2774 background-image: radial-gradient(rgba(255,255,255,0.025) 1px, transparent 1px);

2775 background-size: 24px 24px;

2776 opacity: 0.5;

2777 pointer-events: none;

2778 mask-image: radial-gradient(ellipse at center, #000 30%, transparent 70%);

2779 -webkit-mask-image: radial-gradient(ellipse at center, #000 30%, transparent 70%);

2780 }

2781 :root[data-theme='light'] .empty-state::before {

2782 background-image: radial-gradient(rgba(15,16,28,0.08) 1px, transparent 1px);

2735 background: var(--bg-elevated);

27832736 }

2784 .empty-state > * { position: relative; z-index: 1; }

27852737 .empty-state h2 {

27862738 font-size: var(--t-xl);

27872739 margin-bottom: 8px;

27882740