/* rironbusou.net */
/* Font weights: Inter 400/500, Space Grotesk 700/800, JetBrains Mono 500 */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #0A0A12; color: #6B6B80; font-family: 'Inter', sans-serif; font-weight: 400; font-size: 1rem; line-height: 1.6; position: relative; }
.scanlines { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: repeating-linear-gradient(transparent, transparent 2px, rgba(0,0,0,0.1) 2px, rgba(0,0,0,0.1) 4px); pointer-events: none; z-index: 100; opacity: 0.02; }
.hero { text-align: center; padding: 6rem 2rem 4rem; }
.glitch-text { font-family: 'Space Grotesk', sans-serif; font-weight: 800; font-size: clamp(2.5rem, 6vw, 4rem); color: #E8E8F0; text-transform: uppercase; letter-spacing: 0.04em; position: relative; display: inline-block; }
.glitch-text::before, .glitch-text::after { content: attr(data-text); position: absolute; top: 0; left: 0; }
.glitch-text::before { color: #00F5FF; clip-path: inset(0 0 60% 0); transform: translateX(-2px); animation: glitch 3s ease-in-out infinite; }
.glitch-text::after { color: #FF0066; clip-path: inset(60% 0 0 0); transform: translateX(2px); animation: glitch 3s ease-in-out infinite reverse; }
@keyframes glitch { 0%, 100% { clip-path: inset(0 0 60% 0); transform: translateX(-2px); } 25% { clip-path: inset(20% 0 40% 0); transform: translateX(2px); } 50% { clip-path: inset(50% 0 10% 0); transform: translateX(-1px); } 75% { clip-path: inset(10% 0 50% 0); transform: translateX(1px); } }
.tagline { font-family: 'Inter', sans-serif; font-size: 1rem; color: #6B6B80; margin-top: 1rem; margin-bottom: 2rem; }
.cta-btn { display: inline-block; font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 0.9rem; color: #0A0A12; background: #00F5FF; padding: 0.75rem 2rem; text-decoration: none; text-transform: uppercase; letter-spacing: 0.04em; }
.modules { max-width: 800px; margin: 0 auto; padding: 2rem; }
.glitch-line { height: 1px; background: #1A1A2A; animation: lineGlitch 4s ease-in-out infinite; }
@keyframes lineGlitch { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(1px); } 70% { transform: translateY(-1px); } }
.module-bar { background: #121220; border: 1px solid #1A1A2A; padding: 1.5rem 2rem; display: flex; align-items: center; justify-content: space-between; }
.module-info { flex: 1; }
.module-name { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 1.1rem; color: #E8E8F0; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.5rem; }
.difficulty-bar { width: 200px; height: 4px; background: #1A1A2A; border-radius: 2px; margin-bottom: 0.25rem; }
.difficulty-fill { height: 100%; background: #00F5FF; border-radius: 2px; }
.difficulty-fill.mid { background: #FFE14D; }
.difficulty-fill.hard { background: #FF0066; }
.difficulty-label { font-family: 'JetBrains Mono', monospace; font-size: 0.7rem; color: #00F5FF; }
.mid-label { color: #FFE14D; }
.hard-label { color: #FF0066; }
.enroll-btn { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 0.8rem; color: #00F5FF; border: 1px solid #00F5FF; padding: 0.5rem 1.5rem; text-decoration: none; text-transform: uppercase; letter-spacing: 0.04em; }
.section-title { font-family: 'Space Grotesk', sans-serif; font-weight: 800; font-size: 1.3rem; color: #E8E8F0; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 1.5rem; }
.leaderboard { max-width: 800px; margin: 0 auto; padding: 3rem 2rem; }
.rank-table { display: flex; flex-direction: column; gap: 0; }
.rank-row { display: flex; align-items: center; gap: 1.5rem; padding: 0.75rem 1rem; background: #121220; border-bottom: 1px solid #1A1A2A; }
.rank-row.gold { box-shadow: 0 0 8px rgba(255,225,77,0.1); }
.rank-num { font-family: 'JetBrains Mono', monospace; font-weight: 500; font-size: 1rem; color: #00F5FF; width: 2rem; }
.rank-row.gold .rank-num { color: #FFE14D; }
.rank-user { font-family: 'JetBrains Mono', monospace; font-size: 0.9rem; color: #E8E8F0; flex: 1; }
.rank-ratio { font-family: 'JetBrains Mono', monospace; font-size: 0.8rem; color: #6B6B80; }
.rank-score { font-family: 'JetBrains Mono', monospace; font-weight: 500; font-size: 0.9rem; color: #00F5FF; background: rgba(0,245,255,0.1); padding: 2px 8px; }
.matches { max-width: 800px; margin: 0 auto; padding: 3rem 2rem; }
.match-timeline { border-left: 1px dashed #1A1A2A; padding-left: 2rem; }
.match-item { margin-bottom: 2rem; position: relative; }
.match-item::before { content: ''; position: absolute; left: -2.35rem; top: 0.3rem; width: 8px; height: 8px; background: #00F5FF; border-radius: 50%; }
.match-date { font-family: 'JetBrains Mono', monospace; font-size: 0.75rem; color: #6B6B80; display: block; margin-bottom: 0.25rem; }
.match-topic { font-family: 'Space Grotesk', sans-serif; font-weight: 700; font-size: 1rem; color: #E8E8F0; margin-bottom: 0.25rem; }
.match-participants { font-size: 0.85rem; color: #6B6B80; display: block; margin-bottom: 0.5rem; }
.match-btn { font-family: 'JetBrains Mono', monospace; font-size: 0.8rem; color: #FF0066; text-decoration: none; border: 1px solid #FF0066; padding: 0.3rem 1rem; }
.footer { max-width: 800px; margin: 0 auto; padding: 3rem 2rem; text-align: center; }
.footer-kanji { font-family: 'Space Grotesk', sans-serif; font-weight: 800; font-size: 2rem; color: rgba(232,232,240,0.05); margin-bottom: 1rem; }
.footer-links { display: flex; justify-content: center; gap: 1.5rem; margin-bottom: 1rem; }
.flink { font-size: 0.85rem; color: #6B6B80; text-decoration: none; }
.footer-copy { font-family: 'JetBrains Mono', monospace; font-size: 0.7rem; color: #6B6B80; }
@media (max-width: 640px) {
    .module-bar { flex-direction: column; align-items: flex-start; gap: 1rem; }
    .rank-row { flex-wrap: wrap; }
}
.fade-in { opacity: 0; transform: translateY(12px); transition: opacity 0.5s ease, transform 0.5s ease; }
.fade-in.visible { opacity: 1; transform: translateY(0); }