:root{--color-1: #ffd700;--color-2: #32cd32;--color-3: #ff8c00;--color-4: #9370db;--rook-color: #1a1a2e;--bg-primary: #1a1a2e;--bg-secondary: #16213e;--bg-card: #0f3460;--text-primary: #ffffff;--text-secondary: #a0a0a0;--accent: #e94560;--success: #4caf50;--warning: #ff9800;--error: #f44336;--card-width: 80px;--card-height: 112px;--card-radius: 8px;--card-width-small: 60px;--card-height-small: 84px;--play-area-width: 300px;--play-area-height: 250px;--hand-max-width: 600px;--scoreboard-min-width: 200px;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-md: 1rem;--font-size-lg: 1.25rem;--font-size-xl: 1.5rem}@media (max-width: 1024px){:root{--card-width: 70px;--card-height: 98px;--card-width-small: 50px;--card-height-small: 70px;--play-area-width: 260px;--play-area-height: 220px;--hand-max-width: 500px;--scoreboard-min-width: 180px}}@media (max-width: 768px){:root{--card-width: 55px;--card-height: 77px;--card-width-small: 40px;--card-height-small: 56px;--play-area-width: 200px;--play-area-height: 170px;--hand-max-width: 100%;--scoreboard-min-width: 150px;--spacing-md: .75rem;--spacing-lg: 1rem;--font-size-sm: .75rem;--font-size-md: .875rem;--font-size-lg: 1rem}}@media (max-width: 480px){:root{--card-width: 45px;--card-height: 63px;--card-width-small: 32px;--card-height-small: 45px;--play-area-width: 160px;--play-area-height: 140px;--spacing-sm: .25rem;--spacing-md: .5rem;--spacing-lg: .75rem}}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-secondary) 100%);min-height:100vh;color:var(--text-primary);line-height:1.5}button{cursor:pointer;font-family:inherit;font-size:inherit}button:disabled{cursor:not-allowed;opacity:.5}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-4{gap:1rem}.p-2{padding:.5rem}.p-4{padding:1rem}.rounded{border-radius:.5rem}.text-center{text-align:center}