80 lines
1.7 KiB
CSS
80 lines
1.7 KiB
CSS
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
|
|
|
:root {
|
|
--font-ui: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
|
|
--font-mono: 'Fira Code', 'Courier New', monospace;
|
|
|
|
--accent-red: #ff453a;
|
|
--accent-yellow: #ffd60a;
|
|
--accent-green: #30d158;
|
|
--accent-blue: #0a84ff;
|
|
--accent-purple: #bf5af2;
|
|
--accent-teal: #00ffff;
|
|
--accent-cyan: #00ffff;
|
|
|
|
--glass-bg: #0d0d1a;
|
|
--glass-border: #333333;
|
|
--glass-blur: none;
|
|
--glass-shadow: 4px 4px 0 #000000;
|
|
--radius-window: 0px;
|
|
--radius-icon: 0px;
|
|
|
|
--menubar-height: 28px;
|
|
--dock-height: 72px;
|
|
--titlebar-height: 36px;
|
|
|
|
--pixel-border: 2px solid #333333;
|
|
--pixel-shadow: 4px 4px 0 #000000;
|
|
--pixel-cyan: #00ffff;
|
|
}
|
|
|
|
html, body, #root {
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
font-family: var(--font-ui);
|
|
-webkit-font-smoothing: none;
|
|
font-smooth: never;
|
|
image-rendering: pixelated;
|
|
}
|
|
|
|
/* CRT scanlines + faint phosphor glow over the entire desktop */
|
|
#root::after {
|
|
content: '';
|
|
position: fixed;
|
|
inset: 0;
|
|
pointer-events: none;
|
|
z-index: 9998;
|
|
background:
|
|
repeating-linear-gradient(
|
|
0deg,
|
|
rgba(0, 255, 255, 0.025) 0px,
|
|
rgba(0, 255, 255, 0.025) 1px,
|
|
transparent 1px,
|
|
transparent 3px
|
|
);
|
|
mix-blend-mode: screen;
|
|
animation: crt-flicker 4.2s steps(60) infinite;
|
|
}
|
|
|
|
@keyframes crt-flicker {
|
|
0%, 100% { opacity: 0.85; }
|
|
47% { opacity: 0.92; }
|
|
50% { opacity: 0.6; }
|
|
53% { opacity: 0.9; }
|
|
}
|
|
|
|
@keyframes blink-caret {
|
|
0%, 49% { opacity: 1; }
|
|
50%, 100% { opacity: 0; }
|
|
}
|
|
|
|
.cypher-caret {
|
|
display: inline-block;
|
|
width: 0.55em;
|
|
margin-left: 2px;
|
|
background: var(--pixel-cyan);
|
|
color: transparent;
|
|
animation: blink-caret 1s steps(1) infinite;
|
|
}
|