/* visproto-site.css — Site layer for visproto.com Framework: vis.css | Theme: data-theme="visproto" on */ html { scroll-behavior: smooth; -webkit-font-smoothing: antialiased; } .visnav { background: rgba(5,5,8,0.85); backdrop-filter: blur(16px); border-bottom-width: 1px; } /* Graceful degradation: if vis-effects.js doesn't load, reveal-animated elements remain visible */ .vfx-reveal-up:not(.vfx-revealed), .vfx-reveal-down:not(.vfx-revealed), .vfx-reveal-left:not(.vfx-revealed), .vfx-reveal-right:not(.vfx-revealed), .vfx-reveal-fade:not(.vfx-revealed) { opacity: 1; transform: none; } /* Override vfx-crt filter: filter on body creates a containing block that breaks position:fixed for all descendants. Keep only the scanline overlay (::after), discard the filter. */ .vfx-crt { filter: none !important; } /* FX Badge — bottom-right CRT toggle */ .fx-badge { position: fixed; bottom: 1.25rem; right: 1.25rem; z-index: 10000; background: rgba(0,0,0,0.7); backdrop-filter: blur(8px); border: 1px solid rgba(255,255,255,0.15); color: #555; font-family: 'JetBrains Mono', monospace; font-size: 0.6875rem; letter-spacing: 0.08em; padding: 0.35rem 0.65rem; cursor: pointer; transition: color 0.2s, border-color 0.2s, background 0.2s; line-height: 1; } .fx-badge:hover { color: #999; border-color: rgba(255,255,255,0.25); background: rgba(0,0,0,0.85); } .fx-badge.is-active { color: #eab308; border-color: rgba(234,179,8,0.4); } @media (max-width: 480px) { .fx-badge { bottom: 0.75rem; right: 0.75rem; font-size: 0.5625rem; padding: 0.25rem 0.5rem; } }