/* Homepage (bare domain) styles — kept separate from app styles so the portfolio can grow without touching dashboard/content pages. */ /* Dark theme: overriding the palette variables is enough, because the shared styles color everything through them. Toggled via data-theme on (set pre-paint in home.ejs, persisted in localStorage). */ :root[data-theme="dark"] { --text: #e6edf3; --muted: #8b949e; --border: #30363d; --bg: #0d1117; --bg-subtle: #161b22; --accent: #58a6ff; color-scheme: dark; } body { transition: background-color 0.2s ease, color 0.2s ease; } .home { padding-top: 4rem; } .home-header { display: flex; justify-content: space-between; align-items: baseline; } #theme-toggle { background: none; border: 1px solid var(--border); border-radius: 6px; color: var(--muted); font-size: 1rem; line-height: 1; padding: 0.35rem 0.6rem; cursor: pointer; } #theme-toggle:hover { color: var(--accent); border-color: var(--accent); } .home .tagline { color: var(--muted); font-size: 1.15rem; margin-top: 0; min-height: 1.6em; /* reserve the line while the typing effect runs */ } .tagline .cursor::after { content: "\258B"; /* ▋ */ margin-left: 1px; animation: blink 1.1s steps(1) infinite; } @keyframes blink { 50% { opacity: 0; } } @media (prefers-reduced-motion: reduce) { .tagline .cursor::after { animation: none; } } .social { display: flex; gap: 0.75rem; margin: 1.75rem 0; } .social a { display: inline-flex; align-items: center; gap: 0.45rem; border: 1px solid var(--border); border-radius: 8px; padding: 0.45rem 0.85rem; color: var(--text); } .social a:hover { color: var(--accent); border-color: var(--accent); text-decoration: none; } .social svg { width: 18px; height: 18px; fill: currentColor; } .now { margin-top: 2.5rem; border-top: 1px solid var(--border); } #release-train { display: block; width: 100%; height: 110px; margin-top: 3rem; }