:root { --bg: #0b0b0c; --text: #e6e6e6; --muted: #9a9a9a; --accent: #f4c542; --dotz: #cc3700; } * { box-sizing: border-box; margin: 0; padding: 0; } body { background: var(--bg); color: var(--text); font-family: 'Press Start 2P', monospace; min-height: 100vh; overflow-y: auto; } .container { position: relative; z-index: 2; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 60px 20px; } .tiny { font-size: 10px; color: var(--muted); margin-bottom: 20px; letter-spacing: 2px; } .title { font-size: 28px; margin-bottom: 30px; letter-spacing: 4px; } .subtitle { font-size: 10px; color: var(--muted); margin-bottom: 40px; max-width: 900px; line-height: 1.6; } .stats { font-size: 10px; margin-bottom: 40px; letter-spacing: 2px; } .debug { font-size: 10px; color: var(--muted); max-width: 1000px; line-height: 1.6; margin-bottom: 30px; } .info-block { font-size: 12px; color: var(--muted); max-width: 1100px; line-height: 1.8; margin-bottom: 40px; text-align: center; padding: 0 20px; } .info-block p { margin-bottom: 25px; text-align: justify; } .section-title { font-size: 14px; color: var(--accent); margin-top: 40px; margin-bottom: 20px; text-transform: uppercase; letter-spacing: 2px; text-align: left; width: 100%; } .info-block ul { list-style: none; padding: 0; text-align: left; margin-bottom: 40px; } .info-block li { position: relative; padding-left: 30px; margin-bottom: 15px; line-height: 1.6; } .info-block li::before { content: ">"; position: absolute; left: 0; color: var(--accent); } .dots { display: flex; gap: 8px; margin-bottom: 40px; } .dot { width: 12px; height: 12px; background: var(--accent); border-radius: 20%; animation: pulse 0.8s infinite; } .dot:nth-child(odd) { animation-delay: 0.2s; } @keyframes pulse { 0%, 100% { opacity: 0.3; transform: scale(0.8); } 50% { opacity: 1; transform: scale(1.1); } } .navigation { font-size: 10px; padding-bottom: 30px; color: var(--muted); } .navigation a { color: var(--muted); text-decoration: none; transition: color 0.2s; } .navigation a:hover { color: var(--accent); } .navigation-duo { font-size: 20px; padding-bottom: 30px; color: var(--accent); } .navigation-duo a { color: var(--accent); text-decoration: none; transition: color 0.2s; } .navigation-duo a:hover { color: var(--dotz); } .footer { position: absolute; bottom: 20px; font-size: 10px; color: var(--muted); } .stars { position: absolute; width: 100%; height: 100%; z-index: 1; overflow: hidden; } .star { position: absolute; width: 2px; height: 2px; background: white; opacity: 0.8; animation: twinkle 2s infinite alternate; } @keyframes twinkle { from { opacity: 0.2; } to { opacity: 1; } }