/* ===== Ajedrez Integral — Custom Styles ===== */
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; }
#header.scrolled { height: auto; }
#header.scrolled nav > div { height: 3.5rem; }
#chessboard .square { display: flex; align-items: center; justify-content: center; font-size: clamp(1.5rem, 5vw, 2.5rem); cursor: pointer; transition: background-color 0.15s ease; user-select: none; }
#chessboard .square.light { background-color: #f0f4f8; }
#chessboard .square.dark  { background-color: #486581; }
#chessboard .square.selected { background-color: #f0b429 !important; box-shadow: inset 0 0 0 3px #cb6e17; }
#chessboard .square.legal-move::after { content: ''; width: 30%; height: 30%; border-radius: 50%; background-color: rgba(240, 180, 41, 0.5); position: absolute; }
#chessboard .square.legal-capture { box-shadow: inset 0 0 0 4px rgba(203, 110, 23, 0.7); }
#chessboard .square.last-move { background-color: rgba(240, 180, 41, 0.3) !important; }
#chessboard .square.in-check { background-color: #e53e3e !important; }
#chessboard .piece-white { color: #ffffff; text-shadow: 0 1px 2px rgba(0,0,0,0.4); }
#chessboard .piece-black { color: #1a1a1a; text-shadow: 0 1px 1px rgba(255,255,255,0.2); }
.radio-card-selected { background-color: rgba(240, 180, 41, 0.1); border-color: #de911d; }
#move-history::-webkit-scrollbar { width: 6px; }
#move-history::-webkit-scrollbar-track { background: #f0f4f8; border-radius: 3px; }
#move-history::-webkit-scrollbar-thumb { background: #9fb3c8; border-radius: 3px; }
@keyframes fadeInUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
.animate-fade-in-up { animation: fadeInUp 0.5s ease-out; }