{SITE.name}

{t.tagline}

{messages.length === 0 && !pending && (

Ask the bot what you'd ask me. It's read my notes.

)} {messages.map((m, i) => (

{m.role === "assistant" ? renderMarkdown(m.content) : m.content}

))} {pending &&

thinking…

} {error &&

{error}

}

setDraft(e.target.value)}
            onKeyDown={(e) => {
              // Plain Enter submits; Shift+Enter inserts a newline.
              // Ctrl/Cmd+Enter never submits (avoids accidental sends).
              if (e.key === "Enter") {
                if (e.shiftKey) return; // let the textarea insert a newline
                e.preventDefault();
                if (!e.ctrlKey && !e.metaKey) onSubmit(e);
              }
            }}
            placeholder="Ask anything about Lucas…"
            disabled={pending}
            aria-label="Ask anything"
          />
          <button
            type="submit"
            style={{ ...S.chatSend, opacity: pending || !draft.trim() ? 0.5 : 1 }}
            disabled={pending || !draft.trim()}
            aria-label="Send"
          >→</button>
        </form>

<div style={S.promptsRow}>
          {SUGGESTED.map((p) => (
            <button
              key={p}
              style={S.promptChip}
              onClick={() => onChip(p)}
              disabled={pending}
            >{p}</button>
          ))}
        </div>

<div style={S.scrollHint}>
          <span>or scroll</span>
          <span style={{ width: 28, height: 1, background: "currentColor", opacity: 0.4 }} />
          <span>Work · Projects · Contact</span>
        </div>
      </section>
    );
  }

/* ----------------------------------------------------------------------- */
  /* Work / Projects / Contact sections                                      */
  /* ----------------------------------------------------------------------- */

const COMPANY_LOGOS = {
    "Moveworks":        "https://www.google.com/s2/favicons?domain=moveworks.com&sz=64",
    "Qualcomm":         "https://www.google.com/s2/favicons?domain=qualcomm.com&sz=64",
  };

function WorkSection({ S }) {
    return (
      <section id="work" style={S.section}>
        <div style={S.sectionLabel}>01 — Work</div>
        <h2 style={S.sectionHeading}>Where I've been</h2>
        <div>
          {SITE.workHistory.map((r, i) => (
            <div
              key={i}
              style={{
                ...S.workRow,
                ...(i === SITE.workHistory.length - 1 ? S.workRowLast : null),
              }}
            >
              <CompanyLogo company={r.company} S={S} />
              <div>
                <div style={S.workCo}>
                  {r.company}
                  {r.note && <span style={S.workNote}>({r.note})</span>}
                </div>
                <div style={S.workTitle}>{r.title}</div>
              </div>
              <div style={S.workYears}>{r.years}</div>
            </div>
          ))}
        </div>
      </section>
    );
  }

function ProjectsSection({ S }) {
    return (
      <section id="projects" style={S.section}>
        <div style={S.sectionLabel}>02 — Projects</div>
        <h2 style={S.sectionHeading}>Things I've shipped</h2>
        <div style={S.projectGrid}>
          {(SITE.projects || []).map((p) => (
            <article key={p.slug} style={S.projectCard}>
              <div style={S.projectMeta}>{p.year} · {p.role}</div>
              <h3 style={S.projectTitle}>{p.title}</h3>
              <p style={S.projectBlurb}>{p.blurb}</p>
            </article>
          ))}
        </div>
      </section>
    );
  }

function ContactSection({ S }) {
    return (
      <section id="contact" style={S.sectionLast}>
        <div style={S.sectionLabel}>03 — Contact</div>
        <div style={S.contactWrap}>
          <h2 style={S.contactHeading}>Say hi.</h2>
          <p style={S.contactCopy}>
            Open to the right next thing. Recruiters, founders, friends — all welcome.
            The bot upstairs will answer most things; for the rest, here I am.
          </p>
          <div style={S.contactLinks}>
            <a style={S.contactLink} href={SITE.contact.linkedin} target="_blank" rel="noopener noreferrer">
              <span>LinkedIn</span><span style={S.contactArrow}>↗</span>
            </a>
            <a style={S.contactLink} href={`mailto:${SITE.contact.email}`}>
              <span>{SITE.contact.email}</span><span style={S.contactArrow}>↗</span>
            </a>
          </div>
        </div>
      </section>
    );
  }

/* ----------------------------------------------------------------------- */
  /* ----------------------------------------------------------------------- */
  /* Tweaks panel                                                            */
  /* ----------------------------------------------------------------------- */

function ChatHomeTweaks({ t, setTweak }) {
    return (
      <TweaksPanel title="Tweaks">
        <TweakSection label="Look">
          <TweakColor
            label="Palette"
            value={t.palette}
            options={PALETTES}
            onChange={(v) => setTweak("palette", v)}
          />
          <TweakSelect
            label="Font"
            value={t.font}
            options={FONT_OPTIONS}
            onChange={(v) => setTweak("font", v)}
          />
        </TweakSection>

<TweakSection label="Hero">
          <TweakSlider
            label="Name size"
            value={t.nameSize}
            min={40} max={96} step={2} unit="px"
            onChange={(v) => setTweak("nameSize", v)}
          />
          <TweakText
            label="Tagline"
            value={t.tagline}
            placeholder="A line about you"
            onChange={(v) => setTweak("tagline", v)}
          />
        </TweakSection>
      </TweaksPanel>
    );
  }

/* ----------------------------------------------------------------------- */

function ChatHomeVariant() {
    const [t, setTweak] = useTweaks(TWEAK_DEFAULTS);
    const S = buildStyles(t);

return (
      <div style={S.root}>
        <ChatHero S={S} t={t} />
        <WorkSection S={S} />
        <ProjectsSection S={S} />
        <ContactSection S={S} />
        <ChatHomeTweaks t={t} setTweak={setTweak} />
      </div>
    );
  }

window.ChatHomeVariant = ChatHomeVariant;
})();