@tailwind base;@tailwind components;@tailwind utilities;:root{font-family:Outfit,sans-serif;--primary-color: #6366f1;--secondary-color: #ec4899;--accent-color: #f59e0b;--bg-gradient-start: #0f172a;--bg-gradient-end: #1e1b4b}body{margin:0;min-height:100vh;background:radial-gradient(circle at top left,var(--bg-gradient-start),var(--bg-gradient-end));background-attachment:fixed;color:#fff;overflow-x:hidden}.glass{background:#ffffff08;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);box-shadow:0 4px 30px #0000001a}.glass-card{background:#ffffff0d;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0000005e;transition:all .3s ease}.glass-card:hover{background:#ffffff14;border-color:#fff3;transform:translateY(-2px);box-shadow:0 12px 40px #00000080}.glass-panel{background:#0f172a99;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.05)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0003}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff40}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes toastSlideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.animate-fade-in{animation:fadeIn .6s ease-out forwards}.animate-slide-up{animation:slideUp .6s ease-out forwards}.animate-toast-in{animation:toastSlideIn .3s ease-out forwards}.delay-100{animation-delay:.1s}.delay-200{animation-delay:.2s}.delay-300{animation-delay:.3s}.neon-text{text-shadow:0 0 10px rgba(255,255,255,.5),0 0 20px rgba(99,102,241,.3)}.text-gradient{background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-image:linear-gradient(to right,#818cf8,#c084fc,#f472b6)}@keyframes pieceSlide{0%{transform:translate(var(--from-x, 0),var(--from-y, 0))}to{transform:translate(0)}}.piece-animate-move{animation:pieceSlide .25s cubic-bezier(.2,.8,.2,1)}.piece-hover-effect{transition:transform .15s ease,filter .15s ease}.piece-hover-effect:hover{transform:translateY(-4px) scale(1.05);filter:drop-shadow(0 8px 12px rgba(0,0,0,.4));z-index:50}@keyframes checkPulse{0%,to{box-shadow:inset 0 0 20px #ef444466}50%{box-shadow:inset 0 0 40px #ef4444b3}}.square-check-indicator{animation:checkPulse 2s infinite}@keyframes legalMovePulse{0%,to{transform:scale(1);opacity:.6}50%{transform:scale(1.2);opacity:.9}}.legal-move-dot{animation:legalMovePulse 2s infinite}@keyframes capturePulse{0%,to{border-color:#ef444480;transform:scale(1)}50%{border-color:#ef4444e6;transform:scale(.95)}}.capture-indicator{animation:capturePulse 1.5s infinite}@keyframes pulseSlow{0%,to{opacity:.1}50%{opacity:.3}}.animate-pulse-slow{animation:pulseSlow 4s ease-in-out infinite}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}html,body,#root{height:100%;margin:0;background:#0f1724;color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{width:100%;min-height:100%;padding:0;box-sizing:border-box}.app-container{width:100%;max-width:1280px;margin:0 auto;box-sizing:border-box}.board-wrapper{position:relative;width:100%;max-width:100%;display:flex;justify-content:center;align-items:center;box-sizing:border-box;padding:12px;background:transparent}.board-timer{position:absolute;left:50%;transform:translate(-50%);display:flex;justify-content:space-between;align-items:center;padding:10px 16px;border-radius:8px;box-shadow:0 4px 12px #0006;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Roboto Mono,monospace;font-weight:700;width:100%;max-width:520px;box-sizing:border-box;z-index:20}.board-timer.top{top:-52px;background:#0b1220;color:#fff}.board-timer.bottom{bottom:-52px;background:#fff;color:#0b1220}.board-timer .label{font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.board-timer .time{font-size:1.2rem}
