#terminal-container { -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); background: var(--glass-bg); border-radius: 1rem; border: 1px solid var(--border); box-shadow: var(--shadow-secondary); height: 100%; overflow: hidden; padding: 1rem; position: relative; width: 100% }
#terminal-container::before { background: var(--accent-gradient); content: ""; height: 2px; left: 0; position: absolute; right: 0; top: 0 }
.accent-text, .hover\:accent-text:hover { color: var(--accent) }
.bg-card { background-color: var(--card-bg) }
.dark-mode::before { animation: aurora-float 30s infinite ease-in-out; background: radial-gradient(circle at 15% 25%, rgba(240, 180, 79, 0.08), transparent 40%), radial-gradient(circle at 85% 75%, rgba(64, 192, 192, 0.06), transparent 40%); content: ""; height: 100vh; left: 0; position: fixed; top: 0; width: 100vw; will-change: transform; z-index: -1 }
.light-mode { --accent-gradient: linear-gradient(135deg, #F0B44F 0%, #40C0C0 100%); --accent-secondary: #1A7A7A; --accent: #D4861F; --bg-secondary: #F1F7F9; --bg: #F7FAFB; --border: #E1EEF2; --card-bg: #FFF; --card-hover: #F8FCFD; --glass-bg: rgba(255, 255, 255, 0.7); --header-bg: rgba(255, 255, 255, 0.85); --shadow-primary: 0 4px 32px rgba(212, 134, 31, 0.08); --shadow-secondary: 0 8px 64px rgba(26, 122, 122, 0.05); --tag-bg: #E8F8F9; --tag-text: #1A7A7A; --text-muted: #5B7A86; --text-primary: #0A2329; --text-secondary: #2A4853 }
.xterm .xterm-viewport, .xterm { background-color: transparent }
.xterm-screen { font-family: "JetBrains Mono", monospace }
:root { --accent-gradient: linear-gradient(135deg, #F0B44F 0%, #40C0C0 100%); --accent-secondary: #40C0C0; --accent: #F0B44F; --bg-secondary: #0F2329; --bg: #0A1A21; --border: #2A4A5A; --card-bg: #142A35; --card-hover: #1A3442; --glass-bg: rgba(20, 42, 53, 0.6); --header-bg: rgba(10, 26, 33, 0.85); --shadow-primary: 0 4px 32px rgba(240, 180, 79, 0.1); --shadow-secondary: 0 8px 64px rgba(64, 192, 192, 0.05); --tag-bg: #0F3D4A; --tag-text: #40C0C0; --text-muted: #6B9AA8; --text-primary: #E8F4F8; --text-secondary: #A8D4DB }
body { background-color: var(--bg); color: var(--text-secondary); display: flex; flex-direction: column; font-family: "Inter", sans-serif; transition: background-color 0.3s ease }
h1, h2, h3, h4, .text-strong { color: var(--text-primary); font-family: "JetBrains Mono", monospace }
html, body { height: 100% }
main { align-items: center; display: flex; flex-grow: 1; justify-content: center }