/* ============================================================ terminal.css — agent-exec product page only. CRT / SSH aesthetic: scanlines, typewriter, pulsing live dot. Apply to enable amber palette. ============================================================ */ /* ---------- subtle scanline overlay (CRT feel) ---------- */ body.theme-agent-exec::before { content: ""; position: fixed; inset: 0; background-image: repeating-linear-gradient( to bottom, rgba(255,255,255,0.012) 0px, rgba(255,255,255,0.012) 1px, transparent 1px, transparent 3px ); pointer-events: none; z-index: 2; mix-blend-mode: overlay; } /* ---------- live status pill (above hero title) ---------- */ .live-meta { display: inline-flex; gap: 20px; color: var(--muted); font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; margin-bottom: 24px; } .live-meta span { display: inline-flex; gap: 8px; align-items: center; } .live-meta .live-dot { width: 7px; height: 7px; background: var(--live); border-radius: 50%; box-shadow: 0 0 0 3px rgba(111,185,138,0.12); animation: tg-pulse 2.4s ease-in-out infinite; } @keyframes tg-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.45; } } /* ---------- hero terminal (typewriter replay) ---------- */ .terminal { border: 1px solid var(--border); background: rgba(8,8,7,0.35); font-family: var(--mono); font-size: 13px; margin-top: 32px; } .terminal-chrome { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--border); color: var(--muted); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; } .terminal-chrome .chrome-dots { display: flex; gap: 6px; } .terminal-chrome .chrome-dots i { width: 8px; height: 8px; background: rgba(255,255,255,0.18); display: inline-block; } .terminal-chrome .chrome-title { margin-left: 4px; } .terminal-body { padding: 18px 18px 22px; min-height: 320px; line-height: 1.7; color: var(--text); white-space: pre-wrap; word-break: break-word; } /* terminal line colors */ .terminal .prompt { color: var(--accent); } .terminal .dim { color: var(--muted); } .terminal .ok { color: var(--live); } .terminal .hl { color: var(--accent); } /* blinking block cursor */ .cursor { display: inline-block; width: 8px; height: 15px; background: var(--text); vertical-align: -2px; margin-left: 2px; animation: tg-blink 1.1s steps(2, start) infinite; } @keyframes tg-blink { 50% { opacity: 0; } } /* respect motion preferences */ @media (prefers-reduced-motion: reduce) { .live-meta .live-dot, .cursor { animation: none; } }